akai/readest
2
1
Fork 1
Code Issues Pull Requests Actions 5 Packages Projects Releases Wiki Activity

fix(eink): restore [data-eink='true'] button rule grouping (#4273)

Browse Source 
In #4230 the new .btn-contrast block was inserted into the middle of
the existing rule

  [data-eink='true'] button,
  [data-eink='true'] .btn {
    color: theme('colors.base-content') !important;
  }

which left [data-eink='true'] button grouped with .btn-contrast
(applying background-color/border/color: base-100) and orphaned
[data-eink='true'] .btn as its own rule. Net effect on any button
that also has class="btn" — toolbar icon buttons, popup actions, etc.:

  [data-eink='true'] button    bg=base-content, color=base-100   (specificity 0,1,1)
  [data-eink='true'] .btn      color=base-content                (specificity 0,2,0)

The .btn rule wins on color, so the button ends up with a base-content
background AND base-content text color. react-icons children render
with fill: currentColor → invisible icon on solid background → every
toolbar/popup button becomes a solid black (light mode) or solid white
(dark mode) square in e-ink mode.

Fix is the minimal regroup that #4230 was apparently trying to make:
put the new .btn-contrast block AFTER the existing eink button/.btn
selector list rather than splitting it.

Tested locally: in e-ink mode, all annotation toolbar / quick-action
popup buttons recover their icon glyphs; .btn-contrast still renders
as the intended solid-CTA in both modes.
This commit is contained in:
iFocuspace
2026-05-23 01:32:01 +08:00
committed by GitHub
parent 5c82351ab9
commit 0564b4dd48
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/readest-app/src/styles/globals.css
+4 -4
View File
@@ -565,6 +565,10 @@ input[type='range'].slider-input {
}
[data-eink='true'] button,
[data-eink='true'] .btn {
color: theme('colors.base-content') !important;
}
/* btn-contrast — a solid, high-contrast CTA: base-content background with a
base-100 label. Theme-neutral (unlike the colored btn-primary); fits the
minimalist themes and is already e-ink-correct. */
@@ -577,10 +581,6 @@ input[type='range'].slider-input {
opacity: 0.9;
}
[data-eink='true'] .btn {
color: theme('colors.base-content') !important;
}
[data-eink='true'] .btn-primary,
[data-eink='true'] .btn-outline,
[data-eink='true'] .btn-contrast {