Re: [csswg-drafts] [css-nesting] Syntax suggestion (#4748)

I think it's reasonable to be annoyed at needing two levels of indents per nesting level, as you'll accumulate a huge indent very quickly with just a few levels of nesting. "Just use a smaller indent" means that the *rest* of your code (CSS, JS, HTML), which needs a single indent per nesting level in whatever context it's using, is now *not indented enough*.

Any efforts to avoid it result in editting hazards. In the example you gave, if the author later does need to add some properties to `outer`, either they now have to go back and reformat the entire rule contents to put the braces on a separate line and indent things inward another level, or they just put the properties directly in the second level and wonder why their code isn't working.

It ends up that the safest, most reliable way to format the code, which is hardest to make mistakes with and requires the least amount of reformatting when doing adjacent unrelated edits, will be to just wrap each rule in a `{}` immediately, like:

```css
outer {
 {inner { something: foo; }}
 {more { other: foo; }}
}
```

This formatting pattern allows the author to add new properties *or* nested rules to `outer` with a minimum of fuss or reformatting, and avoids needing two levels of indent per nesting level. The problem is that it's ugly and *still* somewhat error-prone; while writing the example I forgot to do the double-brace `}}` on one of the lines, which would have broken the rest of the stylesheet due to misnesting.

In addition to having bad ergonomics on its own, this pattern is completely foreign, looking nothing like common preprocessors *or* existing CSS, or any other programming language I can come up with immediately. 

----

If we really don't like having two patterns, we can just go with `@nest` as the only way to nest. It loses the connection with all existing preprocessors' similar feature, but it matches up with standard CSS practice, has only a single level of indent per nesting level, and no excess braces. I don't currently believe that would be a good idea, but I'm open to being convinced, and wouldn't object if the rest of the WG decided that was the way to go.

But I'm absolutely opposed to this extra-braces idea, for the reasons stated above.

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


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

Received on Friday, 1 October 2021 19:35:35 UTC