Changed from color inversion to brightness lowered for ko-fi pop up in dark mode, as inversion breaks QR codes

This commit is contained in:
Deven Thiel 2026-03-05 19:00:56 -05:00
parent a9c8d16f05
commit 409d2560bc
6 changed files with 24 additions and 13 deletions

View file

@ -781,14 +781,14 @@ select.ss-input { cursor: pointer; }
min-height: 0;
display: block;
width: 100%;
background: #fff;
}
/* In dark mode, invert the iframe content then rotate hue back so colours
stay natural while the bright white background becomes dark.
Background is set to #fff so it inverts to near-black, matching the theme. */
/* In dark mode, dim the iframe to reduce glare without inverting colours.
Full inversion would break QR codes inside the widget, so we use a gentle
brightness reduction instead enough to soften the bright white background
without flipping black/white and making QR codes unreadable. */
[data-mode='dark'] .kofi-modal iframe {
filter: invert(1) hue-rotate(180deg);
filter: brightness(0.65);
}
/* ─── Hamburger / mobile nav ─────────────────────────────────────────────── */