fix(reader): keep dark-mode page body transparent so the bg texture shows, closes #4446 (#4564)

The body.theme-dark catch-all from #4392 painted every section iframe's
body with the opaque theme bg in dark mode, occluding the host
background texture and poisoning foliate's docBackground capture (so
paginated segments and scrolled view backgrounds resolved opaque too).
Force transparent instead: the dark page fill already comes from the
paginator container / reader grid cell, and book-forced light page
backgrounds stay neutralized since the theme-dark fill shows through.
Unconditional rather than texture-gated because docBackground is
captured once per section load and a gated rule would go stale on live
texture toggling.

Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Huang Xin
2026-06-13 01:37:23 +08:00
committed by GitHub
parent 7f57af8f90
commit 852d0ae3e9
2 changed files with 25 additions and 1 deletions
+7 -1
View File
@@ -191,8 +191,14 @@ const getDarkModeLightBackgroundOverrides = (bg: string) => `
*[style*="background: rgb(255"], *[style*="background:rgb(255"] {
background-color: ${bg} !important;
}
/* Force transparent, not the theme bg: the dark page fill already comes from
the paginator container / reader grid cell, while an opaque body paints over
the host background texture (#4446) — and foliate captures docBackground once
per section load, so the body must stay transparent regardless of texture
state. Book-forced light page backgrounds still get neutralized (#4392) since
the theme-dark fill shows through. */
body.theme-dark {
background-color: ${bg} !important;
background-color: transparent !important;
}
`;