[csswg-drafts] [css-view-transitions-1] CSS selector to differentiate transitions with only old or new images (#8057)

khushalsagar has just created a new issue for https://github.com/w3c/csswg-drafts:

== [css-view-transitions-1] CSS selector to differentiate transitions with only old or new images ==
Filing a separate issue to track the use-case identified in the comment [here](https://github.com/w3c/csswg-drafts/issues/7788#issuecomment-1301515920), pasted below:

I'll note that our suggestion doesn't rely specifically on the specific mapping of class/element syntax, but that provides a good example. Whatever the selector-syntax mapping (@FremyCompany's suggestion of IDs might make more sense), the goal is just to allow compound/complex selectors in the function.

One reason for that might be exposing the hierarchy. The more important goal in my mind was the ability to differentiate what happens in these three instances:

1. There is _only a `new` image_.
2. There is _only an `old` image_.
3. There are _both `old` and `new` images_.

The solution mentioned a few times for that is using `:only-child`/`:not(:only-child)` on the element in question. I assume that solution is also possible with the current proposal?

```css
html::view-transition-old(*):only-child {
  /* this is a default exit animation */
}
```

This could be done with `html::view-transition-old(*):only-child` but @jakearchibald highlighted that " it's tricky because what does ::before:only-child mean? We might need to allow-list which pseudos can use :only-child."


Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8057 using your GitHub account


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

Received on Thursday, 10 November 2022 19:12:57 UTC