Changeset 85b51bf in Klonkt for src/views/pages/read.ejs


Ignore:
Timestamp:
08/18/2026 06:47:58 PM (3 weeks ago)
Author:
Bart <bart@…>
Branches:
main
Children:
87696ce
Parents:
100aad8
git-author:
Bart <bart@…> (08/18/2026 04:33:08 AM)
git-committer:
Bart <bart@…> (08/18/2026 06:47:58 PM)
Message:

Leesweergave: de hand weg, de balken zijn de uitgang

De zwevende 👋 was er voor het geval de balken weg waren. Maar ze komen terug
zodra je omhoog scrolt -- gemeten: klasse eraf binnen een seconde na de eerste
veeg omhoog -- en bovenaan staan ze sowieso. Twee uitgangen die hetzelfde doen
is er één te veel. De zes read.exit-sleutels zijn mee weg.

En dezelfde fout als in de vorige commit zat nog in het reduced-motion-blok:
scroll-snap-type: none stond daar op .read-stream, die niet scrollt. Nu op
<html>, waar het snappen ook staat.

Co-Authored-By: Claude Opus 5 <claude@…>

File:
1 edited

Legend:

Unmodified
Added
Removed

  • src/views/pages/read.ejs

    r100aad8 r85b51bf  
    2424</div>
    2525
    26 <%# De weg terug. Blijft staan als de balken weg zijn -- een scherm zonder
    27     uitgang is geen scherm maar een val. %>
    28 <nav class="read-exit" aria-label="<%= t('read.exit_label') %>">
    29   <a class="read-hand" href="<%= _b %>/" title="<%= t('read.exit') %>" aria-label="<%= t('read.exit') %>">👋</a>
    30 </nav>
     26<%# Geen eigen uitgangsknop. De balken schuiven terug zodra je omhoog scrolt
     27    (en staan er sowieso bovenaan), dus de weg terug is altijd één veeg weg. Een
     28    zwevende knop erbij zou een tweede uitgang zijn die hetzelfde doet. %>
    3129
    3230<noscript>
    … …  
    9189.on-read .read-end  { text-align: center; padding: 2rem 1rem 3rem; opacity: .5; font-size: .9rem; }
    9290
    93 .on-read .read-exit { position: fixed; right: 1rem; bottom: 1rem; z-index: 60; }
    94 .on-read .read-hand {
    95   display: grid; place-items: center; width: 3rem; height: 3rem;
    96   font-size: 1.5rem; text-decoration: none; border-radius: 50%;
    97   background: var(--paper, #fff); box-shadow: 0 2px 10px rgba(0,0,0,.18);
    98 }
    9991.on-read .read-fallback { display: flex; gap: 1rem; padding: 1rem 1.2rem; }
    10092
    10193@media (prefers-reduced-motion: reduce) {
    10294  .on-read #pcms-chrome, .on-read .bottom-tab { transition: none; }
    103   .on-read .read-stream { scroll-snap-type: none; }
     95  html:has(body.on-read) { scroll-snap-type: none; }
    10496}
    10597</style>
Note: See TracChangeset for help on using the changeset viewer.