Re: [csswg-drafts] [css-view-transitions-2][css-conditionals] Exposing navigation/route matching (#12594)

> Is this encouraging authors to add CSS for pages the user has not yet visited, thus bloating the size of CSS and slowing down viewing the page they are currently visiting?

I don’t see how this is any different from having one `styles.css` that styles your entire website, or when having a bunch of container queries inside a stylesheet to style a component at various screen sizes. You could similarly argue those are “bloating the CSS” and are “slowing down” the rest of the page/components because those styles are not relevant for the current page or screen size (yet).

Taking a step back, I believe that moving these bits into CSS will allow authors to remove a pile of JS in order to do the same thing. In the end this would a net win, as I’d like to believe that the amount of CSS needed for this would be smaller than the amount of required JS.

> so what is the advantage really?

I think you might be misunderstanding the proposal? It allows you do things like _“When navigating from A to B, apply these styles”_ which can’t be done in CSS right now.

An example would be the following, which transitions the image on the overview page into the image on the detail page.

```css
/* View Transitions, Yay! */
@view-transition {
  navigation: auto;
}

/* When navigating from items_overview to items_detail */
@navigation ((from: items_overview) and (to: items_detail)) {
  
  /* On the from page … */
  @navigation (at: items_overview) {
    /* Capture the image of the link in the list that was clicked */
    #list a:navigation-trigger img {
      view-transition-name: photo;
    }
  }

  /* On the to page … */
  @navigation (at: items_detail) {
    /* Capture the image in the #hero element */
    #hero {
      view-transition-name: photo;
    }
  }

}
```

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


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

Received on Friday, 14 November 2025 13:54:22 UTC