Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[css-cascade] Can we use @scope for style isolation? #11002

Open
bramus opened this issue Oct 4, 2024 · 3 comments
Open

[css-cascade] Can we use @scope for style isolation? #11002

bramus opened this issue Oct 4, 2024 · 3 comments

Comments

@bramus
Copy link
Contributor

bramus commented Oct 4, 2024

CSS @scope is for selector isolation, not style isolation. Properties that inherit will inherit onto children beyond the scope’s scoping limit. From a lot of authors I hear that they expected it to be about style isolation.

I was wondering if it would be possible to extend @scope to do style isolation too – something I believe would be very helpful for web component authors.

Maybe a prelude like isolated? E.g. @​scope isolated (root) to (limit) { /* no authors styles get in or bleed out */ }.
Or maybe there need to be two flags? One to prevent styles from getting in, and one to prevent them from bleeding out?

@romainmenke
Copy link
Member

What does "bleed" mean exactly in the context of this issue?
I assume that inheritance would still work the same?

@bramus
Copy link
Contributor Author

bramus commented Oct 4, 2024

With it I mean to stop inheritance at the set scoping limit (if any).

@romainmenke
Copy link
Member

Maybe a revert-scope keyword would be better?
This seems very similar to all: revert and all: revert-layer.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants