Uname: Linux webm016.cluster127.gra.hosting.ovh.net 5.15.167-ovh-vps-grsec-zfs-classid #1 SMP Tue Sep 17 08:14:20 UTC 2024 x86_64
Software: Apache
PHP version: 7.4.33 [ PHP INFO ] PHP os: Linux
Server Ip: 54.36.31.145
Your Ip: 216.73.216.182
User: homesquasz (91404) | Group: users (100)
Safe Mode: OFF
Disable Function:
_dyuweyrj4,_dyuweyrj4r,dl

name : if-else.md
# `@if`/`@else`

A stylesheet author might want to treat `@if` and `@else` in a special manner, for example `@else` should be on the same line as its `@if`'s closing brace while all the other blocks and at-rules has to have newline after their closing brace. stylelint-scss has some rules for this, but from the core stylelint's point of view, `@if` and `@else` SCSS statements are pretty much regular at-rules, so they comply to corresponding `at-rule-...` and `block-...` rules. Below are some configurations that might help you achieve the needed patterns.

---

**Config 1**: `@else` is on the same line as the preceding `@if`/`@else`'s `}`, space between them. Empty line before all at-rules (except `@else`), space before `{`, newline after all `}` except `@if`'s and `@else`'s. 

```json
{
  "plugins": [
    "stylelint-scss"
  ],
  "rules": {
    "at-rule-empty-line-before": [
      "always", {
        "ignoreAtRules": [ "else" ]
      }
    ],
    "block-opening-brace-space-before": "always",
    "block-closing-brace-newline-after": [
      "always", {
        "ignoreAtRules": [ "if", "else" ]
      }
    ],
    "at-rule-name-space-after": "always",
    "rule-empty-line-before": "always",
    "scss/at-else-closing-brace-newline-after": "always-last-in-chain",
    "scss/at-else-closing-brace-space-after": "always-intermediate",
    "scss/at-else-empty-line-before": "never",
    "scss/at-if-closing-brace-newline-after": "always-last-in-chain",
    "scss/at-if-closing-brace-space-after": "always-intermediate"
  }
}
```

This code is considered **valid**
```scss
@if {
  // ...
}

a {}

@if {
  // ...
} @else {
  // ...
}

a {}

@if {
  // ...
} @else if {
  // ...
} @else {
  // ...
}

@if {
  // ...
} @else
if {
  // ...
} @else {
  // ...
}

a {}
```

These patterns are considered **non-valid**:

```scss
@if {
  // ...
} a {}
```
```scss
@if {
  // ...
}@else {
  // ...
}
```
```scss
@if {
  // ...
} @else if{
  // ...
} @else {
  // ...
}
```
```scss
@if {
  // ...
} @else if{
  // ...
} @else {
  // ...
}
```

---

**Config 2**: `@else` is on a newline, no empty line before it. 

```json
{
  "plugins": [
    "stylelint-scss"
  ],
  "rules": {
    "at-rule-empty-line-before": [
      "always", {
        "ignoreAtRules": [ "else" ]
      }
    ],
    "at-rule-name-space-after": "always",
    "block-opening-brace-space-before": "always",
    "block-closing-brace-newline-after": "always",
    "at-else-empty-line-before": "never"
  }
}
```

This code is considered **valid**:
```scss
@if {
  // ...
}
@else {
  // ...
}
```

This code is considered **non-valid**:
```scss
@if {
  // ...
}

@else {
  // ...
}
```
© 2026 GrazzMean
Page non trouvée – APK Comptoir Hammami
Jannah Theme License is not validated, Go to the theme options page to validate the license, You need a single license for each domain name.

404 :(

Oups ! Cette page est introuvable.

Il semble que nous ne puissions pas trouver ce que vous cherchez. Peut-être qu'une recherche pourrait vous aider.

Bouton retour en haut de la page