Re: [csswg-drafts] [css-nesting-1] Syntax Invites Errors (#7834)

Also not a fan of a parsing switch.

This would require the author to keep track of which mode they are in: by looking at a nested selector they cannot know if they already are in one of both modes or not.

```css
.foo {
  
  /* insert 20 declarations here */

  .bar & {}  /* πŸ€” Wait, which mode am I in right now? */
}
```

It also can become confusing, as moving blocks of code – e.g. a nested at-rule – can affect other pieces of unrelated code below it.

```css
.foo {
  
  /* insert 20 declarations here */

  @media(…) {
    …
  }

  .bar {}  /* ❌ This line will suddenly break when you move/remove the nested at-rule included above it */
}
```

```css
.foo {

  …
 
  & .foo {
    …
  }


  .bar {}  /* ❌ Moving this block a few lines upwards when reordering your code, requires the addition of an extra leading & in order to keep things working */
}
```

These last ones remind me of the [β€œTwo CSS properties walk into a bar” CSS joke](https://twitter.com/thomasfuchs/status/493790680397803521), in a very negative way.

---

> (@tabatkins) Note, tho, that this will slightly tie our hands in the future - we'll never be able to change the property syntax to start with a non-ident (like doing additive CSS by writing +transform: ... or something). This probably isn't a huge deal, but it is definitely a forwards-compat/language evolution issue to worry about.

Seems like a pretty significant limitation to introduce.

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


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

Received on Saturday, 8 October 2022 21:53:52 UTC