- From: Justin Fagnani via GitHub <sysbot+gh@w3.org>
- Date: Thu, 02 Aug 2018 17:33:38 +0000
- To: public-css-archive@w3.org
I'm unsure of implementation costs, but after thinking about it a bit, defining parts in CSS is definitely more powerful, especially with pseudo-classes and elements because you can abstract away the pseudo-class from the outside.
Some examples I thought of:
Defining parts of a checkerboard:
```css
.cell:nth-child(odd) {
@outer-name(odd-cell);
}
.cell:nth-child(even) {
@outer-name(even-cell);
}
```
Disabling arbitrary elements and inputs:
```css
:disabled, [disabled] {
@outer-name(disabled);
}
```
Adding part names for light children and shadow children via ::slotted():
```css
::slotted(.item), .item {
@outer-name(item);
}
```
(Think of this when combined with display: contents on the host to treat light and shadow children as siblings for flex and grid layouts. It be nice to give a single part name rather than have the outside select the parts and children separately.)
Exposing a pseudo-element like ::before
```css
li::before {
@outer-name(marker);
content: counter(li);
}
```
I'm sure there's some other cases where a component wants hover, active, etc states abstracted or styled the same as some other parts.
--
GitHub Notification of comment by justinfagnani
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2904#issuecomment-410007387 using your GitHub account
Received on Thursday, 2 August 2018 17:34:14 UTC