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

Hmm, interesting idea. Similar (and simpler, even) than the suggested `@nest { /* selectors */ }` option, just without even needing the `@nest` bit?

So what would multiple-level nesting look like?
```
nav.main-nav
{
   display: flex;
   {
      ul
      {
         list-style-type: none;
         {
            li
            {
               margin: 0;
               padding: 0;
            }
            a
            {
               display: flex;
               padding: 0.5em 1em;
            }
         }
      }
   }
}
```

Or, in the inline-braces style y'all seem to prefer for some reason... 😉 
```
nav.main-nav {
   display: flex;
   {
      ul {
         list-style-type: none;
         {
            li {
               margin: 0;
               padding: 0;
            }
            a {
               display: flex;
               padding: 0.5em 1em;
            }
         }
      }
   }
}
```

All I'll say is, my eyes certainly aren't used to visually parsing that code... granted, color-coding would help a ton, but still... 😆 

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


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

Received on Wednesday, 22 September 2021 14:05:55 UTC