Re: [csswg-drafts] [css-nesting]The parent selector should not be placed inside the subselector (#2909)

I understand.
For a lot of reason your's is realy more powerfull that mine. I totaly agree.
Now i will try to describe clearly my motivation, starting with your proposal : I'm interesting about a way to silently have the '& ' prefix on children element. For example.

```
body aside.left, body aside.right {
  & {
    color: red;
  }
  & span.my-sub-span {
    color: red;
  }
  html.no-js & {
    color: green;
  }
}
```
As an extension of your proposal, i propose an equivalent:

```
@nest("^= *") body aside.left, body aside.right {
  {
    color: red;
  }
  span.my-sub-span {
    color: red;
  }
  html.no-js & {
    color: green;
  }
}
```
(note the '&' after html.no-js)
The idea is that @nest("^= *") indicate the default placement of "&" if no present.
'&' becomes facultative. Then if I have a form.css file (without any "&")

```
...
input[type=checkbox]:checked ~ label:before {
    content: "[X]";
    background-color: var(--input-bg-color, white);
}
input[type=radio]:checked ~ label:before {
    content: "(*)";
}
...
```
Considere a second file "specific-website.css"

```
...
@nest("^= *") form.suscribe {

    /* css variables as unobstrusives parameters */
    --input-bg-color: gray;

    @import(form.css);

    /*Some overides*/
    input[type=checkbox] ~ label {
        font-family: monospace;
    }
}
...
```

And in another project, form.css can be directly included in a link html tag since it can, but does not have '&' inner, it does'nt need a "nested context" to be used.


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

Received on Monday, 28 January 2019 14:47:45 UTC