34mdh/hugo-theme
2
0
Fork 0
forked from jakub/jakubb-hugo
Code Pull Requests Activity

Rework colorscheme

Browse Source
This commit is contained in:
Jakub 2024-03-07 06:29:39 -05:00 committed by Worktop
commit 777e53ef81
3 changed files with 86 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
static/css/404.css
View File

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

151
static/css/colorschemes/colors.css
View File

@ -1,97 +1,106 @@
/* Mostly based off of gruvbox */ :root {
/* Colors */
:root { --fg: #06080E;
--col-0: #FFFFFF; --alt-fg: #F1F2F9;
--col-1: #F0F2F9;
--col-2: #3C5197;
--col-3: #0C101D;
--col-4: #18203A;
--col-5: #5F75BF;
--col-6: #1E2848;
--col-7: #12182B;
--col-8: #181F38;
--bg: #D4D8ED;
--alt-bg: #C5CCE8;
--dark-alt-bg: #A9B2DB;
--acc: #3C5197;
--dark-acc: #12182B;
--light-acc: #5F75BF;
/* Color Sheme linking */ /* Color Sheme linking */
--body-bg: var(--col-3); /* Body Colors */
--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); /* Navbar Colors */
--header-bg-hov: var(--col-2); --header-bg: var(--alt-bg);
--header-fg: var(--body-fg); --header-bg-hov: var(--acc);
--header-fg: var(--fg);
--header-shadow: var(--body-bg); --header-fg-hov: var(--alt-fg);
--header-shadow: var(--dark-acc);
--header-shadow-hov: var(--header-shadow); --header-shadow-hov: var(--header-shadow);
--hamburger-fg: var(--col-1); --hamburger-fg: var(--fg);
--hamburger-fg-checked: var(--hamburger-fg); --hamburger-fg-checked: var(--hamburger-fg);
--langs-bg: var(--header-bg); --langs-bg: var(--header-bg);
--lang-btn-bg: var(--header-bg) ; --lang-btn-bg: var(--header-bg) ;
--langs-bg-hov: var(--header-bg-hov); --langs-bg-hov: var(--header-bg-hov);
--langs-fg-hov: var(--header-fg-hov);
/* Content Colors */
--blockquote-border: var(--alt-bg);
--blockquote-border: var(--col-6); --table-bg: var(--dark-alt-bg);
--table-bg-alt: var(--alt-bg);
--table-bg: var(--col-7);
--table-bg-alt: var(--col-8);
--table-border: var(--body-bg); --table-border: var(--body-bg);
--maps-bg: var(--alt-bg);
--maps-border: var(--acc);
--maps-bg: var(--col-4); --button-bg: var(--acc);
--maps-border: var(--col-2); --button-fg: var(--alt-fg);
--button-bg: var(--col-2); /* Calendar Colors */
--button-fg: var(--body-fg); --cal-bg: var(--alt-bg);
--cal-fg: var(--fg);
--cal-month-bg: var(--alt-bg);
--cal-month-fg: var(--fg);
--cal-weekdays-bg: var(--light-acc);
--cal-weekdays-fg: var(--alt-fg);
--cal-day-empty-fg: var(--alt-fg);
--cal-day-empty-bg: var(--dark-alt-bg);
--cal-bg: var(--col-4); --cal-day-busy-fg: var(--alt-fg);
--cal-fg: var(--body-fg); --cal-day-busy-bg: var(--acc);
--cal-day-hover-fg: var(--cal-day-busy-fg);
--cal-day-hover-bg: var(--cal-day-busy-bg);
--cal-month-bg: var(--col-8); --cal-event-fg: var(--alt-fg);
--cal-month-fg: var(--link-fg); --cal-event-bg: var(--light-acc) ;
--cal-weekdays-bg: var(--col-7); --cal-mobile-bg: var(--alt-bg);
--cal-weekdays-fg: var(--cal-fg); --cal-mobile-fg: var(--fg);
--cal-day-empty-fg: var(--col-7); --cal-mobile-border: var(--acc);
--cal-day-empty-bg: var(--col-6); --cal-mobile-link: var(--light-acc);
}
--cal-day-busy-fg: var(--cal-fg); @media (prefers-color-scheme: dark) {
--cal-day-busy-bg: var(--col-7);
--cal-day-hover-fg: var(--col-2);
--cal-day-hover-bg: var(--col-7);
--cal-event-fg: var(--cal-fg);
--cal-event-bg: var(--col-2) ;
--cal-mobile-bg: var(--cal-day-busy-bg);
--cal-mobile-fg: var(--cal-fg);
--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) {
:root { :root {
/* Dark Mode Colors */ /* Dark Mode Colors */
--bg: #06080E;
--fg: #F0F2F9;
--dark-acc: #0C101D;
--alt-bg: #18203A;
--dark-alt-bg: #12182B;
/* Dark Mode Colorsheme Link Overides */ /* Dark Mode Colorscheme Changes */
} --link-fg: var(--light-acc);
--table-bg: var(--dark-acc);
--table-bg-alt: var(----alt-bg);
--button-fg: var(--body-fg);
--cal-bg: var(--dark-acc);
--cal-weekdays-fg: var(--fg);
--cal-day-empty-fg: var(--dark-acc);
--cal-day-busy-fg: var(--acc);
--cal-day-busy-bg: var(--alt-bg);
--cal-event-fg: var(--fg);
--cal-event-bg: var(--acc) ;
}
} }

6
static/css/style.css
View File

@ -377,8 +377,10 @@ blockquote.location p { padding: inherit; }
box-shadow: none; box-shadow: none;
} }
.lang-btn:checked ~ .lang-switch a { box-shadow: none; } .lang-btn:checked ~ .lang-switch a {
.lang-btn:checked ~ .lang-switch a { box-shadow: none; } box-shadow: none;
color: var(--langs-fg-hov);
}
/* lang-switch content (hidden by default) */ /* lang-switch content (hidden by default) */