Changeset 19e28ce in Klonkt for src/assets/css
- Timestamp:
- 09/30/2026 07:38:15 AM (5 hours ago)
- Branches:
- main
- Children:
- ca260d1
- Parents:
- fd8faf5
- File:
-
- 1 edited
-
src/assets/css/style.css (modified) (5 diffs)
Legend:
- Unmodified
- Added
- Removed
-
src/assets/css/style.css
rfd8faf5 r19e28ce 2457 2457 } 2458 2458 2459 /* Snappen doet de SCROLLCONTAINER, en dat is het document -- niet .read-stream, 2460 die heeft overflow: visible en scrollt zelf niet. Proximity en geen mandatory: 2461 in een bericht dat langer is dan het scherm moet je rustig door kunnen lezen. */ 2462 html:has(body.on-home[data-feed-view="reader"]) { 2463 scroll-snap-type: y proximity; 2464 /* GEEN scroll-behavior:smooth hier. Dat maakte elke beweging op deze 2465 scroller traag, ook het snappen zelf -- en een snap moet vlot zijn 2466 (Robin, 20-8: "vlot maar geanimeerd, mag niet te lang duren"). De browser 2467 animeert een snap uit zichzelf al, en korter dan zijn smooth-scroll. 2468 De terug-naar-boven-knop vraagt zijn animatie expliciet aan in 2469 mod/read.js, dus die blijft vloeiend. */ 2470 } 2471 /* En de browser niet óók laten compenseren als Load more er berichten bij zet: 2472 Chrome en Firefox schuiven bij invoegen zelf mee (scroll anchoring), en dat 2473 vecht met het snappen. */ 2459 /* GEWOON SCROLLEN (Robin, 30-9: "Reader view normaal scrollen, Lenis mag 2460 helemaal uit klonkt"). Hier stond scroll-snap-type op het document, en Lenis 2461 deed het snappen erbovenop. Er snapt niets meer: de reader scrolt zoals elke 2462 andere pagina. De .read-anker-punten hieronder staan er nog, maar zonder 2463 snap-container doen ze niets. Terug willen? Zie de vault, "Klonkt Reader 2464 Scroll": native snappen had bekende nadelen, en die staan daar. */ 2465 /* Scroll anchoring uit: als Load more er berichten bij zet, schuiven Chrome en 2466 Firefox anders zelf mee. Stond er voor het snappen, maar ook zonder snappen 2467 hoort wat je leest niet te verspringen. */ 2474 2468 html:has(body.on-home[data-feed-view="reader"]), 2475 2469 .feed-reader .read-stream { overflow-anchor: none; } … … 2561 2555 zichtbare scherm soms de GROTE viewport, en dan komt svh net tekort. 2562 2556 Zichtbaar kost dit niets: berichten hebben geen kader, alleen een scheidings- 2563 lijn erboven, dus het laatste bericht krijgt hooguit witruimte eronder. */ 2564 .feed-reader .read-post:last-child { min-height: 100lvh; } 2557 lijn erboven, dus het laatste bericht krijgt hooguit witruimte eronder. 2558 SINDS 30-9 WEG: zonder snappen hoeft die bovenkant nergens meer heen, en dan is 2559 de volle schermhoogte alleen nog een leeg scherm aan het eind van de stroom. */ 2565 2560 2566 2561 /* 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 2576 2571 witruimte en is een doorlopende stroom vaak prettiger. */ 2577 @media (hover: none) and (pointer: coarse) { 2578 /* Op mobiel draait Lezen in paginamodus (body.is-paged), en die zet hieronder 2579 een vaste hoogte. Deze regel is de terugval voor het moment vóór de module 2580 geladen is, zodat de berichten niet eerst als losse stroom in beeld 2581 springen. */ 2582 .feed-reader .read-post { min-height: 100svh; } 2583 /* Geen native snap op mobiel: dat doet lenis/snap, met een instelbare vangzone 2584 en duur. Twee snapsystemen op dezelfde scroller vechten. */ 2585 html:has(body.on-home[data-feed-view="reader"]) { scroll-snap-type: none; } 2586 } 2572 /* SINDS 30-9 NIET MEER OP MOBIEL AFGEDWONGEN. Een scherm per bericht hoorde bij 2573 vegen van bericht naar bericht, en dat vegen was het snappen. Zonder snappen 2574 gaf het onder een kort bericht een leeg scherm -- dezelfde leegte waar Robin 2575 op 20-8 op desktop over viel. De instelling hierboven geldt nu overal: wie een 2576 scherm per bericht wil, zet hem aan. */ 2587 2577 2588 2578 /* -------- PAGINAMODUS -------- … … 2590 2580 berichten ga je met knoppen. Daarmee doet het scrollgevoel er niet meer toe: 2591 2581 geen momentum om na te bouwen en geen snap die vangt. 2592 De stroom zelf vangt geen vingers meer -- dat regelt lenis.stop() in 2593 mod/read.js -- en data-lenis-prevent op het paneel houdt de scroll BINNEN een 2594 bericht ongemoeid (die controle staat in Lenis vóór de gestopt-controle). 2582 De stroom zelf scrolt niet: dat deed lenis.stop(), en sinds Lenis weg is 2583 (30-9) de regel hieronder op het document. Het paneel scrolt zelf. 2595 2584 Geldt waar een bericht een eigen scherm heeft: op mobiel altijd, op desktop 2596 2585 als de site dat zo instelt. */ 2586 html:has(body.is-paged) { overflow: hidden; } 2597 2587 body.is-paged .feed-reader .read-post { 2598 2588 height: 100svh; … … 2801 2791 @media (prefers-reduced-motion: reduce) { 2802 2792 html:has(body.on-home[data-feed-view="reader"]) { 2803 scroll-snap-type: none;2804 2793 scroll-behavior: auto; 2805 2794 }
Note:
See TracChangeset
for help on using the changeset viewer.
![(please configure the [header_logo] section in trac.ini)](/chrome/site/your_project_logo.png)