Share styles and update props

This commit is contained in:
thiloho
2024-08-20 19:17:05 +02:00
parent bf791f9bfc
commit 0cbf0bd866
29 changed files with 343 additions and 369 deletions

View File

@@ -1,43 +1,3 @@
@font-face {
font-family: "JetBrains Mono";
font-style: normal;
font-display: swap;
font-weight: 400;
src:
url(https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-400-normal.woff2)
format("woff2"),
url(https://cdn.jsdelivr.net/fontsource/fonts/jetbrains-mono@latest/latin-400-normal.woff)
format("woff");
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
U+FFFD;
}
:root {
color-scheme: light dark;
}
*,
*::before,
*::after {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
line-height: 1.5;
font-family: system-ui, sans-serif;
}
img,
picture,
svg,
video {
max-inline-size: 100%;
block-size: auto;
}
ul,
ol {
list-style: inside;
@@ -45,60 +5,37 @@ ol {
.container {
margin-inline: auto;
inline-size: min(100% - 2rem, 75ch);
inline-size: min(100% - var(--space-m), 75ch);
}
header > .container {
display: flex;
flex-direction: column;
gap: 1rem;
gap: var(--space-s);
}
nav,
header,
main,
footer {
padding-block: 1rem;
padding-block: var(--space-s);
}
section:has(> h2) + section:has(> h2) {
margin-block-start: 2rem;
}
section {
display: flex;
flex-direction: column;
gap: 1rem;
margin-block-start: var(--space-l);
}
.articles ul {
display: grid;
list-style: none;
gap: 1rem;
gap: var(--space-s);
grid-template-columns: repeat(auto-fit, minmax(min(100%, 30ch), 1fr));
}
.articles li {
border: 1px solid hsl(0 0% 50%);
padding: 1rem;
padding: var(--space-s);
display: flex;
flex-direction: column;
gap: 0.5rem;
}
pre {
border: 1px solid hsl(0 0% 50%);
padding: 1rem;
overflow-x: auto;
}
code {
font-family: "JetBrains Mono", monospace;
font-size: 0.875rem;
}
:not(pre) > code {
background-color: hsl(0 0% 25%);
padding-inline: 0.25rem;
padding-block: 0.125rem;
gap: var(--space-xs);
}