Re: [csswg-drafts] [css-view-transitions-2] Creating 'classes' of transition groups (#8319)

Is it possible to use existing CSS selectors instead of adding a new CSS property?

Taking @jakearchibald's original example, it would look like this:

Assuming box boxes also have the `box` class applied.

```css
.box-1 {
  view-transition-name: box-1;
}

.box-2 {
  view-transition-name: box-2;
}

.box::view-transition-group(*) {
  /* … */
}

/* OR */

::view-transition-group(*):where(.box) {
  /* … */
}
/* You can choose `:where` or `:has` or `:is` or whatever makes most sense. */
```

When I think about any performance concerns with selector performance,
it feels like the same concerns would exist when applying the `view-transition-class` property too.

Using the selector directly seems to remove one level of indirection.

I prefer the `.box::view-transition-group(*)` syntax more because it communicates a type
of relationship between the DOM element and the "view". The view a pseudo element _associated_ with the DOM element, but it's not a parent-child or sibling relationship.

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


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

Received on Tuesday, 5 December 2023 09:37:23 UTC