Re: [csswg-drafts] [css-nesting-1] Nesting conditional rules (#7830)

Authors might be confused if this is split up.
Nesting is often used to group related code within a single rule.


```css
.my-component {
  /* base styles */
  color: green;


  /* states */
  &:hover {
    color: yellow;
  }

  /* responsive */
  @media (prefers-color-scheme: dark) {
    color: lime;
  }
}
```

Not being able to nest conditional rules would prevent a significant number of authors from using nested css in browsers and would still rely on tooling to downgrade.

Making tools like PostCSS Nesting capable of partially downgrading would also be terribly complex.

-------

Would it be possible to have support detection for nested conditionals alone?
I always assumed that something like `@supports selector(&)` could be used to detect nesting support (maybe it doesn't).

But if nested conditionals are split from nested selectors than it might need its own feature detection?

-- 
GitHub Notification of comment by romainmenke
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7830#issuecomment-1268965791 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Wednesday, 5 October 2022 20:55:43 UTC