WOrk on Colorescheme rework

This commit is contained in:
Jakub 2024-03-07 06:29:39 -05:00 committed by Worktop
commit 87455047de
3 changed files with 126 additions and 23 deletions

View File

@ -5,7 +5,7 @@
.not-found a.logo {
width: 100%;
padding: 20px 0;
background-color: var(--alt-bg);
background-color: var(--header-bg);
text-align: center;
pointer-events: none;
}

View File

@ -0,0 +1,102 @@
/* Mostly based off of gruvbox */
:root {
--main-fg: #06080e;
--main-bg: #c5cde7;
--main-acc: #3c5197;
--alt-acc: #9aa8d5;
--alt-acc-2: #1e2848;
--disabled-bg: #1e2848;
--alt-bg: #9aa8d5;
--alt-bg-2: #a9b4db;
--invert-fg: #c5cde7;
/* Color Sheme linking */
--body-bg: var(--main-bg);
--body-fg: var(--main-fg);
--link-fg: var(--main-acc);
--header-bg: var(--alt-bg);
--header-bg-hov: var(--main-acc);
--header-fg: var(--alt-acc-2);
--header-fg-hov: var(--invert-fg);
--header-shadow: var(--alt-acc-2);
--header-shadow-hov: var(--header-shadow);
--hamburger-fg: var(--main-acc);
--hamburger-fg-checked: var(--alt-acc-2);
--langs-bg: var(--header-bg);
--lang-btn-bg: var(--header-bg) ;
--langs-bg-hov: var(--header-bg-hov);
--blockquote-border: var(--alt-acc);
--table-bg: var(--alt-bg);
--table-bg-alt: var(--alt-bg-2);
--table-border: var(--body-bg);
--maps-bg: var(--alt-bg);
--maps-border: var(--main-acc);
--button-bg: var(--main-acc);
--button-fg: var(--main-bg);
--cal-bg: var(--alt-bg);
--cal-fg: var(--body-fg);
--cal-month-bg: var(--alt-bg-2);
--cal-month-fg: var(--link-fg);
--cal-weekdays-bg: var(--alt-bg);
--cal-weekdays-fg: var(--cal-fg);
--cal-day-empty-fg: var(--alt-bg);
--cal-day-empty-bg: var(--disabled-bg);
--cal-day-busy-fg: var(--cal-fg);
--cal-day-busy-bg: var(--alt-bg);
--cal-day-hover-fg: var(--main-acc);
--cal-day-hover-bg: var(--alt-bg);
--cal-event-fg: var(--cal-fg);
--cal-event-bg: var(--main-acc) ;
--cal-mobile-bg: var(--cal-day-busy-bg);
--cal-mobile-fg: var(--cal-fg);
--cal-mobile-border: var(--main-acc);
--cal-mobile-link: var(--link-fg);
/* Light Mode Colors */
}
@media (prefers-color-scheme: dark) {
:root {
/* Dark Mode Colors */
/* Dark Mode Colorsheme Link Overides */
}
}

View File

@ -1,11 +1,16 @@
/* Mostly based off of gruvbox */
:root {
--col-0: #FFFFFF;
--col-1: #F0F2F9;
--col-2: #3C5197;
--col-3: #0C101D;
--col-4: #18203A;
--bg: #06080E;
--fg: #F0F2F9;
--acc: #3C5197;
--dark-acc: #0C101D;
--alt-bg: #18203A;
--col-5: #5F75BF;
--col-6: #1E2848;
--col-7: #12182B;
@ -14,20 +19,22 @@
/* Color Sheme linking */
--body-bg: var(--col-3);
--body-fg: var(--col-1);
--body-bg: var(--bg);
--body-fg: var(--fg);
--link-fg: var(--col-5);
--link-fg: var(--acc);
--header-bg: var(--col-4);
--header-bg-hov: var(--col-2);
--header-fg: var(--body-fg);
--header-bg: var(--alt-bg);
--header-bg-hov: var(--acc);
--header-shadow: var(--body-bg);
/* --header-fg: var(--body-fg); */
--header-shadow: var(--dark-acc);
--header-shadow-hov: var(--header-shadow);
--hamburger-fg: var(--col-1);
--hamburger-fg: var(--fg);
--hamburger-fg-checked: var(--hamburger-fg);
--langs-bg: var(--header-bg);
--lang-btn-bg: var(--header-bg) ;
--langs-bg-hov: var(--header-bg-hov);
@ -45,10 +52,10 @@
--table-border: var(--body-bg);
--maps-bg: var(--col-4);
--maps-border: var(--col-2);
--maps-bg: var(--alt-bg);
--maps-border: var(--acc);
--button-bg: var(--col-2);
--button-bg: var(--acc);
--button-fg: var(--body-fg);
@ -80,12 +87,6 @@
--cal-mobile-border: var(--col-2);
--cal-mobile-link: var(--link-fg);
/* Light Mode Colors */
--bg: #f9f5d7;
--fg: #3c3836;
--alt-bg: #d5c4a1;
--acc-1: #076678;
--shadow: #504945;
}
@media (prefers-color-scheme: dark) {