fergald/docs

:root::part(some-input) doesn't seem to work

Opened this issue · 2 comments

https://github.com/fergald/docs/blob/master/explainers/css-shadow-parts-1.md#the-all-buttons-in-this-app-should-be-blue-theming-problem

Indicates that theming could be acheived by adding styles like:

:root::part(some-input) { ... }

However, while I could get the exportparts attribute to work as described, I wasn't able to style them from a rule involving :root.

It seems to me that it should be:

:root ::part(some-input) { ... }

ie with a space between :root and ::part.

Here's an example.

What do you think?

Theming was never standardised and there is no implementation. I should update this doc to reflect what has made it to reality.

This part of your explainer is actually implemented in all modern browsers...but the part I mentioned is not correct, and doesn't even make sense since :root::part() would be selecting the document (?) with a part on it....putting a space in it actually does work - check out the example I supplied - and does make sense - ie in the root DOM, anything with a part on it.

It might be worth it to link to the caniuse pages for the features that do work, eg:

https://caniuse.com/mdn-html_global_attributes_exportparts