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

> [@noamr](https://github.com/noamr) is this change targeting SPAs then? An MPA can split CSS by route by putting the CSS into different files, ala `page-one.css`, `page-two.css`, `shared.css`.

It's targeting both, but perhaps in different ways.
It allows `page-one.css` to include `skeleton-of-page-2.css` that would appear instantly when navigation is instantiated but not the whole CSS of the next page.

> 
> For SPAs you can still split into separate files (and should!) but you might need to protect against unwanted styling by doing something like:
> 
> **page-one.css**
> 
> body[page=one] {
>   /* ... */
> }
> **page-two.css**
> 
> body[page=two] {
>   /* ... */
> }
> The major downside of this is the need to nest a bunch of CSS, but this proposal does not improve on that, so what is the advantage really?

There are a lot about this in the [explainer](https://github.com/WICG/declarative-partial-updates/blob/main/route-matching-explainer.md).

Also you can use it with the `if()` function without nesting. As a simple example:

```css
.some-widget {
  display:  if(route(at: home)): none; else: block;
}
```

It's mainly about not requiring `navigate` event or a JS/framework router where all your navigation does is change style.

-- 
GitHub Notification of comment by noamr
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/12594#issuecomment-3532926733 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:56:37 UTC