Asger Geel WeirsøeandClaude Opus 5.5
e58a11c2b4
Samme indhold, URL'er og udseende, bygget af en enkelt zola-binær og Tailwind standalone-CLI uden Node. Kanonisk domæne er asger.weirsoe.dk. Blogindlæg ligger som page bundles med frontmatter Zola forstår, så de gamle stempler er ugyldige, indtil scripts/omstempl.py er kørt med PUBLISH_KEY. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
84 lines
3.4 KiB
CSS
84 lines
3.4 KiB
CSS
/* Bygges med Tailwind standalone-CLI til static/css/site.css (se scripts/build.sh). */
|
|
@import "tailwindcss" source(none);
|
|
@source "../templates";
|
|
@source "../content";
|
|
@import "./inter.css";
|
|
|
|
/* Fælles tema (Weircon-wind) */
|
|
@import "../vendor/weirsoe-theme/adapters/tailwind.css";
|
|
@import "../vendor/weirsoe-theme/weirsoe-theme.css" layer(components);
|
|
|
|
@theme {
|
|
--font-sans: "Inter Variable", ui-sans-serif, system-ui, -apple-system, sans-serif;
|
|
}
|
|
html[data-theme="terminal"] {
|
|
--font-sans: ui-monospace, "Cascadia Code", "JetBrains Mono", Menlo, Consolas, monospace;
|
|
}
|
|
:root { --wt-font-sans: var(--font-sans); }
|
|
@layer base { a { color: inherit; } }
|
|
|
|
/* Samme fade mellem sider som før */
|
|
@view-transition { navigation: auto; }
|
|
|
|
/* Kommandopalette */
|
|
.palette-overlay {
|
|
position: fixed; inset: 0; z-index: 100;
|
|
background: color-mix(in srgb, var(--color-bg) 60%, transparent);
|
|
backdrop-filter: blur(4px);
|
|
display: flex; align-items: flex-start; justify-content: center; padding-top: 15vh;
|
|
}
|
|
.palette-box {
|
|
width: min(36rem, calc(100vw - 2rem));
|
|
border: 1px solid var(--color-border); border-radius: 1rem;
|
|
background: var(--color-surface); box-shadow: 0 24px 64px rgb(0 0 0 / .45);
|
|
overflow: hidden;
|
|
}
|
|
.palette-input {
|
|
width: 100%; padding: .9rem 1.1rem; font-size: 1rem;
|
|
background: transparent; color: var(--color-text); border: 0; outline: none;
|
|
border-bottom: 1px solid var(--color-border);
|
|
}
|
|
.palette-list { max-height: 50vh; overflow-y: auto; padding: .35rem; }
|
|
.palette-item {
|
|
display: flex; justify-content: space-between; align-items: center; gap: 1rem;
|
|
padding: .55rem .8rem; border-radius: .6rem; cursor: pointer; font-size: .925rem;
|
|
}
|
|
.palette-item.is-selected, .palette-item:hover:not(.palette-empty) { background: var(--color-surface-2); }
|
|
.palette-empty { color: var(--color-muted); cursor: default; }
|
|
.palette-badge {
|
|
font-size: .7rem; color: var(--color-muted);
|
|
border: 1px solid var(--color-border); border-radius: 999px; padding: .05rem .5rem;
|
|
}
|
|
.palette-hint {
|
|
padding: .5rem 1.1rem; font-size: .72rem; color: var(--color-muted);
|
|
border-top: 1px solid var(--color-border);
|
|
}
|
|
|
|
/* Kodeblokke */
|
|
.prose pre { position: relative; }
|
|
.giallo-l { display: inline-block; min-height: 1lh; width: 100%; }
|
|
.copy-btn {
|
|
position: absolute; top: .45rem; right: .45rem;
|
|
font-size: .68rem; line-height: 1; padding: .35rem .6rem;
|
|
color: var(--color-muted); background: var(--color-surface-2);
|
|
border: 1px solid var(--color-border); border-radius: .5rem;
|
|
opacity: 0; transition: opacity .15s ease; cursor: pointer;
|
|
}
|
|
.prose pre:hover .copy-btn, .copy-btn:focus-visible { opacity: 1; }
|
|
.copy-btn:hover { color: var(--color-text); }
|
|
.mermaid-diagram { margin: 1.5rem 0; overflow-x: auto; }
|
|
.mermaid-diagram svg { max-width: 100%; height: auto; }
|
|
|
|
/* /now */
|
|
.heatmap { display: flex; gap: 3px; width: max-content; }
|
|
.hm-col { display: flex; flex-direction: column; gap: 3px; }
|
|
.hm-cell { width: 11px; height: 11px; border-radius: 2.5px; background: var(--color-surface-2); }
|
|
.hm-1 { background: color-mix(in srgb, var(--color-accent) 30%, var(--color-surface-2)); }
|
|
.hm-2 { background: color-mix(in srgb, var(--color-accent) 55%, var(--color-surface-2)); }
|
|
.hm-3 { background: color-mix(in srgb, var(--color-accent) 80%, var(--color-surface-2)); }
|
|
.hm-4 { background: var(--color-accent); }
|
|
|
|
/* /profiler */
|
|
.copy { transition: color 0.15s; }
|
|
.copy:hover { color: var(--color-accent); text-decoration: underline; text-underline-offset: 3px; }
|