5aa043daea
Woodpecker CI is gone from the runtime; this purges the stale mentions in env/dev scripts, dashboards, homepages, CSS comments, and READMEs. Renames the SSO admin env var WOODPECKER_ADMIN to GITEA_ADMIN to match where the admin actually lives. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
158 lines
4.5 KiB
CSS
158 lines
4.5 KiB
CSS
/* HTI-5 — fhirworx design system
|
|
Single source of truth for the colour palette.
|
|
Design: Federal Register Meets Data Journalism
|
|
Inspired by ProPublica, The Marshall Project, and the Federal Register
|
|
|
|
When changing a token here, propagate to the service-specific files:
|
|
inject.css, dashboard.css, grafana.css, marimo.css */
|
|
|
|
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@400;600;700&family=Source+Serif+4:ital,wght@0,300;0,400;0,600;1,400&family=JetBrains+Mono:wght@400;500;600&display=swap');
|
|
|
|
:root {
|
|
/* ── Core palette ──────────────────────────────────────────── */
|
|
/* Off-white background, near-black text */
|
|
--background: #F7F5F0;
|
|
--foreground: #1A1A18;
|
|
|
|
/* Card: slightly warmer white */
|
|
--card: #FAFAF7;
|
|
--card-foreground: #1A1A18;
|
|
|
|
--popover: #FAFAF7;
|
|
--popover-foreground: #1A1A18;
|
|
|
|
/* Primary: deep federal blue/navy */
|
|
--primary: #1C2B3A;
|
|
--primary-foreground: #F7F5F0;
|
|
|
|
--secondary: #EDEBE6;
|
|
--secondary-foreground: #2D2D2B;
|
|
|
|
--muted: #EDEBE6;
|
|
--muted-foreground: #6B6B68;
|
|
|
|
--accent: #EDEBE6;
|
|
--accent-foreground: #1A1A18;
|
|
|
|
--destructive: #C0392B;
|
|
--destructive-foreground: #F7F5F0;
|
|
|
|
--border: #D4D0C8;
|
|
--input: #D4D0C8;
|
|
--ring: #1C2B3A;
|
|
|
|
--radius: 0.2rem;
|
|
|
|
/* ── Sidebar: deep federal navy ────────────────────────────── */
|
|
--sidebar: #1C2B3A;
|
|
--sidebar-foreground: #B8C5D0;
|
|
--sidebar-primary: #5B8FA8;
|
|
--sidebar-primary-foreground: #F7F5F0;
|
|
--sidebar-accent: #253748;
|
|
--sidebar-accent-foreground: #EEE9E0;
|
|
--sidebar-border: #253748;
|
|
--sidebar-ring: #5B8FA8;
|
|
|
|
/* ── Chart palette: indigo scale + teal + amber ────────────── */
|
|
--chart-1: #6B7FD7; /* indigo medium */
|
|
--chart-2: #4A5CB8; /* indigo dark */
|
|
--chart-3: #2E3D8F; /* indigo deep */
|
|
--chart-4: #2E8B6E; /* teal (support) */
|
|
--chart-5: #C8702A; /* amber (opposition) */
|
|
|
|
/* ── Typography ─────────────────────────────────────────────── */
|
|
--font-display: "Playfair Display", Georgia, serif;
|
|
--font-body: "Source Serif 4", Georgia, serif;
|
|
--font-mono: "JetBrains Mono", "Fira Code", monospace;
|
|
}
|
|
|
|
/* ── Editorial base styles ────────────────────────────────── */
|
|
|
|
body {
|
|
font-family: var(--font-body);
|
|
font-size: 16px;
|
|
line-height: 1.65;
|
|
background: var(--background);
|
|
color: var(--foreground);
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
h1, h2, h3, h4, h5, h6 {
|
|
font-family: var(--font-display);
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
letter-spacing: -0.01em;
|
|
color: var(--foreground);
|
|
}
|
|
|
|
code, kbd, pre, .font-mono {
|
|
font-family: var(--font-mono);
|
|
}
|
|
|
|
/* ── Editorial component classes ──────────────────────────── */
|
|
|
|
/* Rule lines — structural dividers, not borders */
|
|
.rule-line {
|
|
border: none;
|
|
border-top: 3px solid var(--foreground);
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
.rule-line-thin {
|
|
border: none;
|
|
border-top: 1px solid var(--border);
|
|
margin-bottom: 1rem;
|
|
}
|
|
|
|
/* Eyebrow — canonical mono label treatment for metadata, IDs, KPI labels */
|
|
.eyebrow {
|
|
font-family: var(--font-mono);
|
|
font-size: 0.7rem;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.12em;
|
|
color: var(--muted-foreground);
|
|
}
|
|
|
|
/* Pull quote — editorial emphasis */
|
|
.pull-quote {
|
|
border-left: 3px solid var(--primary);
|
|
padding-left: 1rem;
|
|
font-style: italic;
|
|
color: var(--muted-foreground);
|
|
font-family: var(--font-body);
|
|
}
|
|
|
|
/* Prose — long-form reading columns */
|
|
.prose {
|
|
max-width: 65ch;
|
|
}
|
|
|
|
.prose p {
|
|
line-height: 1.75;
|
|
color: var(--foreground);
|
|
}
|
|
|
|
/* ── WCAG 2.2 AA — Accessibility ──────────────────────────── */
|
|
|
|
/* Focus indicators (2.4.7, 2.4.11) */
|
|
:focus-visible {
|
|
outline: 2px solid var(--primary) !important;
|
|
outline-offset: 2px !important;
|
|
}
|
|
|
|
/* Reduced motion (2.3.3) */
|
|
@media (prefers-reduced-motion: reduce) {
|
|
*, *::before, *::after {
|
|
animation-duration: 0.01ms !important;
|
|
animation-iteration-count: 1 !important;
|
|
transition-duration: 0.01ms !important;
|
|
scroll-behavior: auto !important;
|
|
}
|
|
}
|
|
|
|
/* Minimum target size (2.5.8) */
|
|
button, [role="button"], a, input, select, textarea {
|
|
min-height: 24px;
|
|
min-width: 24px;
|
|
}
|