kate522/wordpress-theme-aksrt
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(theme): stop sun/moon overlap and restore dark float contrast

Browse Source 
Drive toggle glyphs with html.dark/body theme classes only, drop
inline display styles that lost to !important CSS, and give the
float rail a solid surface + brighter ink in dark mode.
This commit is contained in:
kate522
2026-07-25 10:18:19 +08:00
parent b5f13c4a1f
commit 2898922a17
7 changed files with 103 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
assets/css/frontend/floating-buttons.css
+30 -15
View File
@@ -314,24 +314,28 @@
}
}
.float-btn__icon-moon {
display: none;
/*
* Theme float glyph: light → moon, dark → sun.
* Match nav toggle + theme.js contract. Class-driven only.
*/
.float-right .float-btn__icon-sun {
display: none !important;
}
.float-btn__icon-sun {
display: inline-block;
.float-right .float-btn__icon-moon {
display: inline-block !important;
}
.theme-dark .float-btn__icon-moon,
html.dark .float-btn__icon-moon,
body.dark-theme .float-btn__icon-moon {
display: inline-block;
html.dark .float-right .float-btn__icon-moon,
body.theme-dark .float-right .float-btn__icon-moon,
body.dark-theme .float-right .float-btn__icon-moon {
display: none !important;
}
.theme-dark .float-btn__icon-sun,
html.dark .float-btn__icon-sun,
body.dark-theme .float-btn__icon-sun {
display: none;
html.dark .float-right .float-btn__icon-sun,
body.theme-dark .float-right .float-btn__icon-sun,
body.dark-theme .float-right .float-btn__icon-sun {
display: inline-block !important;
}
/* VIP float rail entry */
@@ -348,14 +352,25 @@ body.dark-theme .float-btn__icon-sun {
cursor: pointer;
}
.theme-dark .float-right,
/* Dark: solid surface + brighter icon so transparent btn doesn't vanish */
html.dark .float-right,
body.theme-dark .float-right,
body.dark-theme .float-right {
--float-btn-color: var(--color-ink-4);
--float-btn-color: var(--color-ink-2, #e5eef7);
--float-btn-bg: var(--surface-1, #323335);
}
html.dark .float-right .float-btn,
body.theme-dark .float-right .float-btn,
body.dark-theme .float-right .float-btn {
border-color: rgba(255, 255, 255, 0.12);
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
color: var(--this-color, var(--float-btn-color));
background: var(--this-bg, var(--float-btn-bg));
}
.theme-dark .float-right .hover-show-con,
html.dark .float-right .hover-show-con,
body.theme-dark .float-right .hover-show-con,
body.dark-theme .float-right .hover-show-con {
background: var(--surface-2, #1f2430);
border-color: rgba(255, 255, 255, 0.08);