Made Subbtle Progress on Light Mode

This commit is contained in:
2025-06-03 19:28:53 +10:00
parent b11dd89ff6
commit b3e84d08fa
2 changed files with 67 additions and 40 deletions
+4 -1
View File
@@ -116,10 +116,13 @@ const applyThemeStyles = function(): void {
// Apply the selected theme using StyleTag // Apply the selected theme using StyleTag
themeStyleTag.css = selectedStyle; themeStyleTag.css = selectedStyle;
}; };
// Make this function available globally so Settings can call it // Make this function available globally so Settings can call it
(window as any).updateOLEDThemeStyles = applyThemeStyles; (window as any).updateOLEDThemeStyles = applyThemeStyles;
// Apply the OLED theme initially // Apply the OLED theme initially
applyThemeStyles(); applyThemeStyles();
+63 -39
View File
@@ -129,13 +129,7 @@
color: #333333; color: #333333;
} }
/* Override button span color specifically for play/shuffle buttons */
button[data-test="play-all"] [class^="button"]>span,
button[data-test="shuffle-all"] [class^="button"]>span,
button[data-test="play-all"] span,
button[data-test="shuffle-all"] span {
color: white !important;
}
[class^="_explicitBadge"] { [class^="_explicitBadge"] {
color: var(--wave-color-solid-accent-fill); color: var(--wave-color-solid-accent-fill);
@@ -292,42 +286,72 @@ button[data-test="close-now-playing"]:hover {
margin-top: 7.5px; margin-top: 7.5px;
} }
/* Play and Shuffle buttons - ultra aggressive targeting */ /* Button styling using proper light theme approach */
button[data-test="play-all"], :root {
button[data-test="shuffle-all"], --button-light: #d9d9d9 !important;
div[data-test="play-all"], --button-medium: #cbcbcb !important;
div[data-test="shuffle-all"] {
background-color: #666666 !important;
color: white !important;
border-radius: 12px !important;
} }
/* Target all possible text and icon elements */ /*buttons*/
button[data-test="play-all"] *, ._activeTab_f47dafa {
button[data-test="shuffle-all"] *, background: #0000001c;
div[data-test="play-all"] *,
div[data-test="shuffle-all"] *,
[data-test="play-all"] span,
[data-test="shuffle-all"] span,
[data-test="play-all"] svg,
[data-test="shuffle-all"] svg,
[data-test="play-all"] path,
[data-test="shuffle-all"] path,
[data-test="play-all"] div,
[data-test="shuffle-all"] div,
[data-test="play-all"] button,
[data-test="shuffle-all"] button {
color: white !important;
fill: white !important;
background-color: transparent !important;
} }
/* Override any CSS variable usage */ /*canvas nav buttons*/
[data-test="play-all"], .viewAllButton--Nb87U,
[data-test="shuffle-all"] { .css-7l8ggf {
--wave-color-solid-accent-fill: white !important; background: #e0e0e0;
--wave-color-solid-contrast-fill: white !important; }
--wave-text-body-medium: white !important;
.viewAllButton--Nb87U:hover,
.css-7l8ggf:hover {
background: #cbcbcb;
}
/*tracks page*/
.variantPrimary--pjymy,
._button_3357ce6 {
background-color: var(--button-light);
}
._button_f1c7fcb {
background: var(--wave-color-solid-base-brighter);
}
._button_84b8ffe {
background-color: var(--wave-color-solid-base-brighter);
}
._button_84b8ffe:hover {
background-color: var(--wave-color-solid-base-brightest);
}
.button--_0I_t {
background-color: var(--button-light);
}
.button--_0I_t:hover {
background-color: var(--wave-color-opacity-contrast-fill-regular);
}
._button_94c5125 {
background: var(--wave-color-solid-base-brighter);
}
.primary--NLSX4 {
background-color: #d5d5d5;
}
.primary--NLSX4:hover {
background-color: var(--wave-color-opacity-contrast-fill-regular) !important;
}
.primary--NLSX4:disabled {
background-color: #e7e7e8;
}
.primary--NLSX4:disabled:hover {
background-color: #e7e7e8;
} }
[class^="__NEPTUNE_PAGE"], [class^="__NEPTUNE_PAGE"],