light mode fixes (PLEASE let this work)

This commit is contained in:
Samidy 2025-10-02 13:19:00 +03:00
parent 33b910c617
commit 869f0397f0
2 changed files with 16 additions and 12 deletions

View file

@ -56,9 +56,9 @@ const updateThemeColor = (colorName: ColorNames) => {
// if user isnt using halloween theme switch it // if user isnt using halloween theme switch it
const nonHalloweenOverride = colorName !== 'halloween' ? ` const nonHalloweenOverride = colorName !== 'halloween' ? `
--vp-c-bg: rgb(26, 26, 26) !important; --vp-c-bg: #ffffff !important;
--vp-c-bg-alt: rgb(23, 23, 23) !important; --vp-c-bg-alt: #f9f9f9 !important;
--vp-c-bg-elv: rgba(23, 23, 23, 0.8) !important; --vp-c-bg-elv: rgba(255, 255, 255, 0.7) !important;
--vp-button-alt-bg: #484848 !important; --vp-button-alt-bg: #484848 !important;
--vp-button-alt-text: #f0eeee !important; --vp-button-alt-text: #f0eeee !important;
--vp-button-alt-hover-bg: #484848 !important; --vp-button-alt-hover-bg: #484848 !important;
@ -89,10 +89,10 @@ const updateThemeColor = (colorName: ColorNames) => {
const nonHalloweenBodyOverride = colorName !== 'halloween' ? ` const nonHalloweenBodyOverride = colorName !== 'halloween' ? `
body { body {
background-color: rgb(26, 26, 26) !important; background-color: #ffffff !important;
} }
.VPApp, .Layout, .VPContent, .VPHome, .VPHero, #app { .VPApp, .Layout, .VPContent, .VPHome, .VPHero, #app {
background-color: rgb(26, 26, 26) !important; background-color: #ffffff !important;
} }
.dark body { .dark body {
background-color: rgb(26, 26, 26) !important; background-color: rgb(26, 26, 26) !important;

View file

@ -64,12 +64,12 @@
--vp-custom-block-halloween-text-deep: var(--halloween-900); --vp-custom-block-halloween-text-deep: var(--halloween-900);
} }
/* Apply halloween theme by default */ /* Apply Halloween theme by default (for light mode)*/
:root { :root {
--vp-c-bg: rgb(20, 20, 20) !important; --vp-c-bg: #fef3e8 !important;
--vp-c-bg-alt: rgb(18, 18, 18) !important; --vp-c-bg-alt: #fef0e7 !important;
--vp-c-bg-elv: rgba(18, 18, 18, 0.8) !important; --vp-c-bg-elv: rgba(254, 240, 231, 0.8) !important;
--vp-c-bg-soft: rgb(18, 18, 18) !important; --vp-c-bg-soft: #fef0e7 !important;
--vp-button-alt-bg: #a855f7 !important; --vp-button-alt-bg: #a855f7 !important;
--vp-button-alt-text: #fff !important; --vp-button-alt-text: #fff !important;
--vp-button-alt-hover-bg: #9333ea !important; --vp-button-alt-hover-bg: #9333ea !important;
@ -83,13 +83,14 @@
} }
body { body {
background-color: rgb(20, 20, 20) !important; background-color: #fef3e8 !important;
} }
.VPApp, .Layout, .VPContent, .VPHome, .VPHero, #app { .VPApp, .Layout, .VPContent, .VPHome, .VPHero, #app {
background-color: rgb(20, 20, 20) !important; background-color: #fef3e8 !important;
} }
/* Apply Halloween theme by default - (for dark mode) */
.dark { .dark {
--vp-c-bg: rgb(15, 15, 15) !important; --vp-c-bg: rgb(15, 15, 15) !important;
--vp-c-bg-alt: rgb(12, 12, 12) !important; --vp-c-bg-alt: rgb(12, 12, 12) !important;
@ -106,6 +107,9 @@ body {
--vp-button-brand-hover-border: #ea580c !important; --vp-button-brand-hover-border: #ea580c !important;
--vp-button-brand-hover-text: #fff !important; --vp-button-brand-hover-text: #fff !important;
} }
--vp-button-brand-hover-border: #ea580c !important;
--vp-button-brand-hover-text: #fff !important;
}
.dark body { .dark body {
background-color: rgb(15, 15, 15) !important; background-color: rgb(15, 15, 15) !important;