mirror of
https://github.com/lrnselfreliance/wrolpi.git
synced 2026-10-26 19:01:39 -04:00
57985cea94
Filtering media was keyed on `data-theme="night"`, which made it a property of
the theme that no user could turn off. Some people want their media tinted to
match the interface; some want to see the actual image.
A theme now declares a filter and whether it starts on, and the user decides:
night night-red on by default. An unfiltered thumbnail undoes dark
adaptation, which is the whole point of the mode.
amber amber-mono off by default. Amber is a look, not a night-vision
aid, so media keeps its real colors until asked for.
light - no filter offered, so no toggle is shown.
dark -
The choice is stored per theme, so wanting amber's tint says nothing about
wanting night's. The toggle lives in the theme picker, which puts it on the
Settings page and in the gallery at once.
Mechanically the rules now key on a `data-media-filter` attribute rather than
`data-theme`: a rule keyed on the theme could not be turned off. index.html
stamps that attribute before first paint alongside data-theme -- without it,
night mode paints a screen of unfiltered thumbnails while the bundle arrives
over a hotspot, costing the user the adaptation the theme exists to protect.
Tests cover both the attribute rule and the fact that the inline script's
duplicated ids and defaults still agree with names.ts.
The amber matrix is the same luminance collapse tinted to #ff9500 (red full,
green 0.584, blue zero) with a gentler gamma than night's: amber carries far
more luminance and clips to a flat wash otherwise.
The gallery gains a Media filtering section showing the WROLPi logo filtered,
beside an unfiltered copy that opts out with `night-unfiltered`. That copy is
behind a click on purpose -- an unfiltered image is a bright patch, and night
mode should not spring one on someone reading in the dark.
ui-design.md gains the media filtering contract it never got in Phase 0,
including the note that a Phase 3 custom theme names an existing filter id and
cannot ship its own matrix, since that would be code rather than data.
|
||
|---|---|---|
| .. | ||
| epub | ||
| android-chrome-192x192.png | ||
| android-chrome-512x512.png | ||
| apple-touch-icon.png | ||
| favicon-16x16.png | ||
| favicon-32x32.png | ||
| favicon-blue.svg | ||
| favicon-brown.svg | ||
| favicon-green.svg | ||
| favicon-grey.svg | ||
| favicon-olive.svg | ||
| favicon-orange.svg | ||
| favicon-pink.svg | ||
| favicon-purple.svg | ||
| favicon-red.svg | ||
| favicon-teal.svg | ||
| favicon-violet.svg | ||
| favicon-yellow.svg | ||
| favicon.ico | ||
| icon-transparent.png | ||
| icon.svg | ||
| index.html | ||
| logo192.png | ||
| logo512.png | ||
| manifest.json | ||
| mstile-150x150.png | ||
| one-time-pad-cheat-sheet.pdf | ||
| robots.txt | ||
