From 586d646ad3021c9a9a0927020ded8ab72c7022c7 Mon Sep 17 00:00:00 2001 From: David Luevano Alvarado Date: Wed, 21 Apr 2021 18:02:10 -0600 Subject: kinda finish new style --- static/css/light.css | 83 ++++++++++++++++++++++++++++++---------------------- 1 file changed, 48 insertions(+), 35 deletions(-) (limited to 'static/css/light.css') diff --git a/static/css/light.css b/static/css/light.css index 4f41d5f..27df3c4 100644 --- a/static/css/light.css +++ b/static/css/light.css @@ -28,17 +28,8 @@ --switch-sun: var(--color13); } -html { - background: var(--bg); -} - -body { - background: var(--body-bg); - color: var(--fg); - border: 4px outset var(--fg); -} - -a{ +/* general */ +a { color: var(--link); } @@ -66,49 +57,44 @@ h5 { color: var(--fg-acc5); } -/* switch */ -.slider { - background-color: var(--switch-bg); -} - -#theme-switcher-container i.fa-moon { - color: var(--switch-moon); -} - -#theme-switcher-container i.fa-sun { - color: var(--switch-sun); -} - -.slider:before { - background-color: var(--switch-slider); +body { + background: var(--bg); + color: var(--fg); } -.switch input:checked + .slider { - background-color: var(--switch-toggled-bg); +main { + background: linear-gradient(var(--bg) 0.5em, 1em, var(--body-bg) 1.5em calc(100% - 1.5em), calc(100% - 1em), var(--bg) calc(100% - 0.5em)); } -.switch input:focus + .slider { - box-shadow: 0 0 0.1em var(--switch-ol); +/* nav bar */ +body > header { + background: linear-gradient(var(--body-bg) calc(100% - 1.5em), calc(100% - 1em), var(--bg) calc(100% - 0.5em)); } -/* menu bar (header) */ -.menubar li { +nav li { background: var(--navitem-bg); } -.menubar a { +nav a { color: var(--navitem-link); } -.menubar li:hover { +nav li:hover { background: var(--navitem-bg-hl); color: var(--fg-hl); } -.menubar li:hover > a { +nav li:hover > a { color: var(--navitem-link-hl); } + +/* footer */ +body > footer { + background: linear-gradient(var(--bg) calc(100% - 1.5em), calc(100% - 1em), var(--body-bg) calc(100% - 0.5em)); +} + + /* image gallery (not really being used rn) */ div.gallery { border: 1px solid var(--fg-hl); @@ -117,3 +103,30 @@ div.gallery { div.gallery:hover { border: var(--fg-acc5); } + + +/* switch */ +.slider { + background-color: var(--switch-bg); +} + +.theme-switch-container i.fa-moon { + color: var(--switch-moon); +} + +.theme-switch-container i.fa-sun { + color: var(--switch-sun); +} + +.slider:before { + background-color: var(--switch-slider); +} + +.switch input:checked + .slider { + background-color: var(--switch-toggled-bg); +} + +.switch input:focus + .slider { + box-shadow: 0 0 0.1em var(--switch-ol); +} + -- cgit v1.2.3-54-g00ecf