Changeset 19e28ce in Klonkt for src/assets/css/style.css

Timestamp:

09/30/2026 07:38:15 AM (3 hours ago)

Author:

Robin <roboburr@…>

Branches:

main

Children:

ca260d1

Parents:

fd8faf5

Message:

Lezen scrolt gewoon, en Lenis is uit Klonkt

Robin, 30-9: "Reader view normaal scrollen, Lenis mag helemaal uit klonkt."

Lenis stond alleen in de leesweergave: op desktop voor zacht scrollen en
snappen naar de bovenkant van een bericht, op mobiel nam hij de vinger over en
bootste mod/read.js het snappen na. Dat is er allemaal uit, en de browser
scrolt nu zoals op elke andere pagina.

ER SNAPT OOK NIETS MEER, en dat is een keuze. Er lag nog een native route
klaar (scroll-snap-type, alleen bij naar beneden scrollen aangezet), maar die
had precies de problemen waarom Lenis er ooit kwam: bij het laden sprong hij
naar het eerste bericht zodat de header wegviel, en bij een harde veeg vloog hij
over een grens. "Normaal scrollen" is zonder snappen; de vault-notitie "Klonkt
Reader Scroll" zegt hoe het native terug kan als dat toch gewild is.

Wat met het snappen meeging:

• de richtingsdetectie in read.js (wiel, vinger, toetsen, rust-timer): die bestond alleen om het snappen aan en uit te zetten;
• de volle schermhoogte op het laatste bericht: die maakte zijn bovenkant bereikbaar als snappunt, en is zonder snappen een leeg scherm aan het eind;
• de afgedwongen schermhoogte per bericht op mobiel: die hoorde bij vegen van bericht naar bericht, en gaf onder een kort bericht dezelfde leegte waar Robin op 20-8 op desktop over viel. De site-instelling "elk bericht een eigen scherm" geldt nu overal voor wie dat wil.

De bewaarde paginamodus (staat uit) leunde op lenis.stop() om de stroom vast te
zetten; dat doet nu een regel CSS op het document, en de balken gaan met native
scrollIntoView. Niet uitgeprobeerd sinds die omzetting, want de modus staat uit;
dat staat er ook bij.

Weg: src/assets/vendor/lenis.mjs en lenis-snap.mjs (57 KB samen, en twee
netwerkrondes voordat er iets werkte), en data-lenis-prevent op het zoekvak.
Scroll anchoring blijft uit: ook zonder snappen hoort wat je leest niet te
verspringen als Load more er berichten bij zet. init() zet een inline
scroll-snap-type van de vorige versie terug, voor een tabblad dat na een
htmx-wissel met de oude module was begonnen.

MOD_V 67 en style.css v111: anders draait een browser die er al was nog een jaar
de oude read.js met Lenis.

Volledige suite 1292 groen; er leunde geen toets op Lenis of het snappen.

Co-Authored-By: Claude Opus 5.5 <noreply@…>

File:

• src/assets/css/style.css (modified) (5 diffs)

src/assets/css/style.css

@@ -2457 +2457 @@
 }
 
-/* Snappen doet de SCROLLCONTAINER, en dat is het document -- niet .read-stream,
-   die heeft overflow: visible en scrollt zelf niet. Proximity en geen mandatory:
-   in een bericht dat langer is dan het scherm moet je rustig door kunnen lezen. */
-html:has(body.on-home[data-feed-view="reader"]) {
-    scroll-snap-type: y proximity;
-    /* GEEN scroll-behavior:smooth hier. Dat maakte elke beweging op deze
-       scroller traag, ook het snappen zelf -- en een snap moet vlot zijn
-       (Robin, 20-8: "vlot maar geanimeerd, mag niet te lang duren"). De browser
-       animeert een snap uit zichzelf al, en korter dan zijn smooth-scroll.
-       De terug-naar-boven-knop vraagt zijn animatie expliciet aan in
-       mod/read.js, dus die blijft vloeiend. */
-}
-/* En de browser niet óók laten compenseren als Load more er berichten bij zet:
-   Chrome en Firefox schuiven bij invoegen zelf mee (scroll anchoring), en dat
-   vecht met het snappen. */
+/* GEWOON SCROLLEN (Robin, 30-9: "Reader view normaal scrollen, Lenis mag
+   helemaal uit klonkt"). Hier stond scroll-snap-type op het document, en Lenis
+   deed het snappen erbovenop. Er snapt niets meer: de reader scrolt zoals elke
+   andere pagina. De .read-anker-punten hieronder staan er nog, maar zonder
+   snap-container doen ze niets. Terug willen? Zie de vault, "Klonkt Reader
+   Scroll": native snappen had bekende nadelen, en die staan daar. */
+/* Scroll anchoring uit: als Load more er berichten bij zet, schuiven Chrome en
+   Firefox anders zelf mee. Stond er voor het snappen, maar ook zonder snappen
+   hoort wat je leest niet te verspringen. */
 html:has(body.on-home[data-feed-view="reader"]),
 .feed-reader .read-stream { overflow-anchor: none; }
@@ -2561 +2555 @@
    zichtbare scherm soms de GROTE viewport, en dan komt svh net tekort.
    Zichtbaar kost dit niets: berichten hebben geen kader, alleen een scheidings-
-   lijn erboven, dus het laatste bericht krijgt hooguit witruimte eronder. */
-.feed-reader .read-post:last-child { min-height: 100lvh; }
+   lijn erboven, dus het laatste bericht krijgt hooguit witruimte eronder.
+   SINDS 30-9 WEG: zonder snappen hoeft die bovenkant nergens meer heen, en dan is
+   de volle schermhoogte alleen nog een leeg scherm aan het eind van de stroom. */
 
 /* ELK BERICHT EEN EIGEN SCHERM, als de site dat wil (Instellingen -> Weergave).
@@ -2575 +2570 @@
    Op desktop blijft het een keuze, want daar lees je in een kolom naast veel
    witruimte en is een doorlopende stroom vaak prettiger. */
-@media (hover: none) and (pointer: coarse) {
-    /* Op mobiel draait Lezen in paginamodus (body.is-paged), en die zet hieronder
-       een vaste hoogte. Deze regel is de terugval voor het moment vóór de module
-       geladen is, zodat de berichten niet eerst als losse stroom in beeld
-       springen. */
-    .feed-reader .read-post { min-height: 100svh; }
-/* Geen native snap op mobiel: dat doet lenis/snap, met een instelbare vangzone
-       en duur. Twee snapsystemen op dezelfde scroller vechten. */
-    html:has(body.on-home[data-feed-view="reader"]) { scroll-snap-type: none; }
-}
+/* SINDS 30-9 NIET MEER OP MOBIEL AFGEDWONGEN. Een scherm per bericht hoorde bij
+   vegen van bericht naar bericht, en dat vegen was het snappen. Zonder snappen
+   gaf het onder een kort bericht een leeg scherm -- dezelfde leegte waar Robin
+   op 20-8 op desktop over viel. De instelling hierboven geldt nu overal: wie een
+   scherm per bericht wil, zet hem aan. */
 
 /* -------- PAGINAMODUS --------
@@ -2590 +2580 @@
    berichten ga je met knoppen. Daarmee doet het scrollgevoel er niet meer toe:
    geen momentum om na te bouwen en geen snap die vangt.
-   De stroom zelf vangt geen vingers meer -- dat regelt lenis.stop() in
-   mod/read.js -- en data-lenis-prevent op het paneel houdt de scroll BINNEN een
-   bericht ongemoeid (die controle staat in Lenis vóór de gestopt-controle).
+   De stroom zelf scrolt niet: dat deed lenis.stop(), en sinds Lenis weg is
+   (30-9) de regel hieronder op het document. Het paneel scrolt zelf.
    Geldt waar een bericht een eigen scherm heeft: op mobiel altijd, op desktop
    als de site dat zo instelt. */
+html:has(body.is-paged) { overflow: hidden; }
 body.is-paged .feed-reader .read-post {
     height: 100svh;
@@ -2801 +2791 @@
 @media (prefers-reduced-motion: reduce) {
     html:has(body.on-home[data-feed-view="reader"]) {
-        scroll-snap-type: none;
         scroll-behavior: auto;
     }