- From: Amelia Bellamy-Royds via GitHub <sysbot+gh@w3.org>
- Date: Sat, 02 Feb 2019 21:11:55 +0000
- To: public-css-archive@w3.org
> As much as I like declarative APIs, trying to define this in an attribute would be a mess.
Belated brain flash: What if we—hear me out, now—used CSS syntax? So states for the custom element could be defined with an `@state` rule in a stylesheet that applies to the shadow tree, similar to @tabatkins's [custom selectors proposal](http://tabatkins.github.io/specs/css-aliases/#custom-selectors).
```css
@state { /* state for the entire widget */
checked: #checkbox:checked ;
/* the widget is checked if the shadow element with id `checkbox` is checked */
}
@state drop-down-button { /* state for any element with part="drop-down-button" */
focus: :focus-within;
/* the part will match the focus pseudoclass for the outside tree
if it contains a focused element within the shadow tree */
}
```
If allowing colons inside a value in a declaration-like structure is a syntax issue, the selectors could be wrapped in `{}` to clearly isolate them.
--
GitHub Notification of comment by AmeliaBR
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/3431#issuecomment-459999521 using your GitHub account
Received on Saturday, 2 February 2019 21:11:56 UTC