Re: [csswg-drafts] When using @import scope(), are the imported styles 'nested'? (#11756)

`@sheet` could offer a way forwards to have both.

`index.css`
```css
@import "foo.css" scope(.bar)
```

`foo.css`
```css
a { color: green; }
```

Could be merged as:

```css
@sheet some-sheet-id {
  a { color: green; }
}

@import some-sheet-id scope(.bar)
```

This implies that tools can't bundle `@import scope()` for a while, until support for `@sheet` is sufficient, but this is a (relatively) short term pain.

--------

I can also see use cases for both behaviors:

1: A CSS author might be importing a 3rd party stylesheet and might want to scope it.
The author of the 3rd party sheet would not have written it with scoping in mind and applying it as it were wrapped in `@scope` might give unexpected results.

2: A CSS author might organize their files so that each component has their own stylesheet. Importing each with a `@import scope(.my-component)` condition seems like a very natural thing to do. Getting different behavior from wrapping in `@scope (.my-component)` would be surprising for this author.

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Thursday, 20 February 2025 17:23:07 UTC