Jonny Barnes
d2bc91794b
Libron is the body serif and Cal Sans is used for headings and the header nav, both under the SIL OFL with licences alongside the font files. Both are preloaded so the header doesn't shift while Cal Sans loads. Also nudge note text up and note/article metadata down in size. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
82 lines
1.2 KiB
CSS
82 lines
1.2 KiB
CSS
@layer base {
|
|
:root {
|
|
--border-radius: 8px;
|
|
}
|
|
|
|
html {
|
|
font-size: 125%;
|
|
}
|
|
|
|
body {
|
|
display: grid;
|
|
grid-template-columns: 1fr min(80ch, 80vw) 1fr;
|
|
grid-template-rows: min-content 1fr min-content;
|
|
padding-inline: 4vw;
|
|
|
|
> header {
|
|
grid-column: 1/-1;
|
|
}
|
|
|
|
> main {
|
|
grid-column: 1/-1;
|
|
display: grid;
|
|
grid-template-columns: subgrid;
|
|
|
|
> * {
|
|
grid-column: 2/3;
|
|
}
|
|
|
|
> .full-bleed {
|
|
grid-column: 1/-1;
|
|
}
|
|
}
|
|
|
|
> footer {
|
|
grid-column: 1/-1;
|
|
margin-block-start: 2ex;
|
|
|
|
search form {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
gap: 1ex;
|
|
|
|
input {
|
|
min-width: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.h-feed {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 2ex;
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.h-entry {
|
|
pre {
|
|
padding: 1rem;
|
|
}
|
|
|
|
.post-info {
|
|
font-size: 85%;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@layer components {
|
|
.draft-notice {
|
|
margin-block-end: 2ex;
|
|
padding: 1ex 1em;
|
|
border: 2px dashed var(--clr-border);
|
|
border-radius: 8px;
|
|
background: light-dark(
|
|
oklch(95% 0.08 85deg),
|
|
oklch(30% 0.08 85deg)
|
|
);
|
|
}
|
|
}
|