Compare commits

...

4 Commits

Author SHA1 Message Date
5ff62b4889 kinda funky hover states 2026-01-06 08:44:05 -08:00
48423b8702 fix some outline and border spacing 2026-01-06 08:40:51 -08:00
d435aa4867 trailing spaces 2026-01-06 08:40:36 -08:00
5494711402 new color scheme 2026-01-06 08:40:19 -08:00
6 changed files with 22 additions and 21 deletions

BIN
assets/img/logo-dark.png Normal file → Executable file

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

After

Width:  |  Height:  |  Size: 52 KiB

BIN
assets/img/logo-light.png Normal file → Executable file

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

After

Width:  |  Height:  |  Size: 52 KiB

View File

@ -21,7 +21,7 @@
grid-area: h1;
font-size: 2rem;
margin: 0;
border-bottom: solid var(--color-accent);
border-bottom: .25rem solid var(--color-accent);
}
.resident img {

View File

@ -14,20 +14,20 @@
#directory li {
list-style: none;
border: solid thin var(--color-accent);
border: solid .25rem var(--color-accent);
border-radius: .5rem;
outline-offset: .1rem;
outline-offset: .25rem;
margin: 0;
}
@media (any-hover: hover) {
#directory li:hover {
background-color: var(--color-text);
border-color: var(--color-text);
}
#directory li:hover h2 {
color: var(--color-bg);
border-color: var(--color-accent-flipped);
}
}

View File

@ -1,19 +1,19 @@
:root {
color-scheme: light dark;
--color-light: #d5e9ff;
--color-light-alt: #beddff;
--color-dark: #001a33;
--color-dark-alt: #00274b;
--color-orange-light: #ff764f;
--color-orange-dark: #f55e33;
--color-light: #e5e0c7;
--color-light-alt: #d1cbab;
--color-dark: #142B15;
--color-dark-alt: #1a3b1b;
--color-accent-light: #4ba19e;
--color-accent-dark: #0c6a74;
--color-bg: light-dark(var(--color-light), var(--color-dark));
--color-text: light-dark(var(--color-dark), var(--color-light));
--color-bg-alt: light-dark(var(--color-light-alt), var(--color-dark-alt));
--color-text-alt: light-dark(var(--color-dark-alt), var(--color-light-alt));
--color-accent: light-dark(var(--color-orange-dark), var(--color-orange-light));
--color-accent-flipped: light-dark(var(--color-orange-light), var(--color-orange-dark));
--color-accent: light-dark(var(--color-accent-dark), var(--color-accent-light));
--color-accent-flipped: light-dark(var(--color-accent-light), var(--color-accent-dark));
}
* {

View File

@ -12,21 +12,23 @@ nav a {
text-decoration: none;
font-size: 1.2rem;
padding: 0 .25rem;
border: solid thin var(--color-accent);
border: solid .125rem var(--color-accent);
border-radius: .25rem;
outline-offset: .1rem;
}
@media (any-hover: hover) {
nav a:hover {
color: var(--color-bg);
background-color: var(--color-text);
border-color: var(--color-text);
background-color: var(--color-text-alt);
border-color: var(--color-accent-flipped);
outline: .125rem solid var(--color-accent);
outline-offset: 0;
}
}
nav a:focus-visible {
outline: solid .25rem var(--color-accent);
outline: solid .125rem var(--color-accent);
outline-offset: .125rem;
}
#skip {
@ -37,7 +39,6 @@ nav a:focus-visible {
height: 1px;
overflow: hidden;
z-index: -99;
background-color: var(--color-bg);
}
#skip:focus-visible {