all repos — homestead @ 2d8ae277e25117ab59eeb95c6ed25b34bcd75e4f

Code for my website

add two-week availability calendar

Alan Pearce
commit

2d8ae277e25117ab59eeb95c6ed25b34bcd75e4f

parent

0296be4cbce9b13896dd703e868029672e55fd8c

1 file changed, 49 insertions(+), 0 deletions(-)

changed files
M templates/style.csstemplates/style.css
@@ -6,11 +6,14 @@ --font-scale: 1em;
--background-color: #fff; --heading-color: #222; --text-color: #444; + --muted-color: #888; --link-color: #3273dc; --visited-color: #8b6fcb; --code-background-color: #f2f2f2; + --today-background-color: #f2f2f2; --code-color: #222; --blockquote-color: #222; + --border-color: #222; } @media (prefers-color-scheme: dark) {
@@ -18,11 +21,14 @@ :root {
--background-color: #01242e; --heading-color: #eee; --text-color: #ddd; + --muted-color: #ccc; --link-color: #8cc2dd; --visited-color: #8b6fcb; --code-background-color: #000; + --today-background-color: #000; --code-color: #ddd; --blockquote-color: #ccc; + --border-color: #ccc; } }
@@ -250,3 +256,46 @@ list-style-type: none;
padding-left: unset; margin-block-start: 0.5rex; } + +time { + font-variant-numeric: tabular-nums; +} + +.calendar-grid { + display: grid; + grid-template-columns: repeat(7, 1fr); + grid-template-rows: repeat(2, 1fr); + gap: 0.5ch; +} + +.day { + padding: 0.2ch 0.5ch 0.5ch; + min-height: 6rem; +} + +.past { + opacity: 0.5; +} + +.day h3 { + margin-block: 0 0.5ch; + font-size: 1.1rem; + font-weight: normal; +} + +.day.today h3 { + font-weight: bold; +} + +.event { + font-size: 0.9rem; +} + +.today { + background-color: var(--today-background-color); +} + +.calendar footer { + font-size: small; + color: var(--muted-color); +}