Re: [csswg-drafts] [css-cascade-6] Strong vs weak scoping proximity (#6790)

I didn't mean to imply that this isn't the right thread, it might be, but I don't have any opinions or say about that :)

------

> Now you have mistakenly applied the first component's styles to this component. So you haven't gotten rid of the need for hashing.

That is correct.
`@scope` is not a drop in replacement for CSS Modules or similar tools.
These tools try to isolate styles by hashing every user defined ident, thereby making them unique within a single codebase.

`@scope` does this by defining boundaries, not by making everything unique.
They are different tools that work in different ways but both can be used to solve the same problems.

<details>
<summary>A few examples</summary>

Tools/frameworks can automatically add these `@scope` rules around CSS that was written for a specific component.

An author might write : 

```css
img {
  aspect-ration: 1;
}
```

```html
<img ...>
```

And the framework would convert to :

```css
@scope (.component-34htjkhjg) {
  img {
    aspect-ration: 1;
  }
}
```

And if the framework has a clear "hook" for template slots it could also generate lower boundaries.

```css
img {
  aspect-ration: 1;
}
```

```html
<img ...>

<div class="template-slot-a">
  <!-- some framework mechanic for slots -->
</div>
```

And the framework would convert to :

```css
@scope (.component-34htjkhjg) to (.template-slot-a > *) {
  img {
    aspect-ration: 1;
  }
}
```
</details

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


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

Received on Thursday, 16 March 2023 14:40:33 UTC