- From: Jakob Eriksen via GitHub <sysbot+gh@w3.org>
- Date: Tue, 22 Nov 2022 18:50:24 +0000
- To: public-css-archive@w3.org
I've changed the title to perhaps better illustrate my intend
A use case is targeting components and variations without collisions
```
[data-comp^~="card"] { ... } /* card component */
[data-comp^~="card"][data-comp~="news"] { ... } /* news card variation */
[data-comp^~="card"][data-comp~="fancy"] { ... } /* fancy card variation */
// would match (in order)
<article data-comp="card">
<article data-comp="card news">
<article data-comp="card fancy">
```
The above syntax will allow creating
```
[data-comp^~="card-header"] { ... } /* card header component */
<article data-comp="card-header">
```
...**without** the latter also being matched by the _card component selector_ (as it will - using the existing `^=` syntax)
The reason I picked the whitespace `~` for my example syntax was to convey the same idea of bounding (exact match)
--
GitHub Notification of comment by jakob-e
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8124#issuecomment-1324109255 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 22 November 2022 18:50:26 UTC