mrwnslz/diora-web
1
0
Fork 0
Code Issues 4 Pull requests Projects Releases Packages Wiki Activity Actions

Reader: Marker-Farben mit color:inherit statt UA-Default-Schwarz (SW v30)
All checks were successful
Build and push Docker image / build (push) Successful in 16s
Details
Test / test (push) Successful in 15s
Details

Browse source 
mark-Elemente haben browserseitig einen UA-Default (color:black), der bislang
nicht überschrieben wurde — beim Markieren von Text im dunklen Standard-Theme
(weißer Fließtext) sprang die Markierung dadurch abrupt auf schwarzen Text.
Jetzt color:inherit, damit markierter Text immer die Farbe des umgebenden
Texts behält; die vier Hintergrundfarben sind dafür kräftiger/dunkler gewählt,
sodass sie in allen drei Themes (dunkel/weißer Text, Sepia, Hell) ausreichend
Kontrast zum inherited Text bieten (WCAG-Kontrastwerte 4.8:1–11.7:1, per
Playwright-Screenshot in allen drei Themes gegengeprüft).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
marwin 2026-08-04 18:44:09 +02:00
parent b805d62b11
commit 42bc090a28
2 changed files with 12 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
static/css/app.css
View file

@ -1812,11 +1812,17 @@ body.reader-immersive.reader-show-bottom .reader-overlay { bottom: var(--bar-h)
/* Highlight marks */
.reader-no-bold * { font-weight: normal !important; }
.reader-content img { max-width: 100%; height: auto; display: block; }
.epub-highlight { border-radius:2px; cursor:pointer; }
.epub-highlight[data-color="yellow"] { background:rgba(241,196,15,.4); }
.epub-highlight[data-color="green"] { background:rgba(46,204,113,.35); }
.epub-highlight[data-color="blue"] { background:rgba(52,152,219,.35); }
.epub-highlight[data-color="red"] { background:rgba(230,57,70,.35); }
/* color:inherit overrides the browser's UA-default `mark { color: black }` —
without it, highlighted text abruptly flips to black regardless of the
reader theme's own text color (jarring on the default dark theme, whose
body text is white). Inheriting keeps highlighted text the same color as
the text around it in every theme; the background tones below are chosen
dark/saturated enough to stay readable specifically against white text. */
.epub-highlight { border-radius:2px; cursor:pointer; color:inherit; }
.epub-highlight[data-color="yellow"] { background:rgba(184,134,11,.55); }
.epub-highlight[data-color="green"] { background:rgba(30,140,90,.55); }
.epub-highlight[data-color="blue"] { background:rgba(41,110,180,.55); }
.epub-highlight[data-color="red"] { background:rgba(190,50,60,.55); }
/* Margin ("page margin") panel — left of the reader content. Highlights without
a note show as a small color dot; anything with note text (freeform notes or

2
static/js/sw.js
View file

@ -2,7 +2,7 @@
* diora service worker — caches the app shell for offline use.
*/
const CACHE = 'diora-v29';
const CACHE = 'diora-v30';
const PODCAST_CACHE = 'diora-podcast-v1';
const SHELL = [
'/static/css/app.css',