Unable to disable view_transitions

goblinfactory commented 1 month ago

Describe the Bug

WHEN

editing the starter blog website; and either
- deleting the line view_transitions: true
- or, editing the line to view_transitions: false

AND

navigating between links from the home page, to a blog post

THEN

the view transitions are still active

expected behaviour

The view transitions should not be active
The default when no transition is configured in site.yaml should be inactive.

Environment

OS: Osx
Package Manager: bun 
JS Runtime: bun 
Nuekit Version : nue -v `✓ Nue 1.0.0-beta.1 • Bun 1.1.27`

nobkd commented 1 month ago

The simple blog example is probably not the best to see the difference.

The view_transitions key only disables the ::view-transition (see end of @lib/motion.css) and disables nue's content swapping / page router (which enables partial page changes).

It does not influence @starting-style (see start of @lib/motion.css), which probably looks a little like a view-transition, but is different from it.

I hope this clears things up. Please let me know, if there really is a bug, or if this was just a mix-up!

Note: view transitions don't work in all browsers. Chromium based ones should work.

See no starting style effects:

/* motion setup */
header, h1, h1 + p, h1 + p + * {
  transition: opacity .5s, filter .7s;
  filter: none;
  opacity: 1;

-  @starting-style {
-    filter: blur(10px);
-    opacity: 0;
-  }
}

/* apply motion in sequence */
h1          { transition-delay: .1s }
h1 + p      { transition-delay: .2s }
h1 + p + *  { transition-delay: .4s }

See no view transitions (this code also just runs, when view_transitions is enabled and your browser has js active, I think)

/* view transitions */
article {
-  view-transition-name: article;
}

/* view transition (scales down the old page) */
::view-transition-old(article) {
  transform: scale(1.2) translateY(2em);
  transition: .8s;
}

PS: you might have to delete your .dist to get the change...

nobkd commented 1 month ago

Needs improved docs

Apart from that, was my assumption correct, that you meant that @starting-style still happens after disabling view_transitions?

tipiirai commented 1 month ago

The view transition property disables the client-side navigation/routing feature and users normal page loads on the browser. It does not impact how CSS works apart from all the ::view-transition-* stuff is not triggering

nuejs / nue