/* * Compendion font presets. * * Selbstgehostete WOFF2-Dateien liegen unter assets/fonts/. * Der Live-Switch laeuft ueber `data-font-preset` auf dem -Element; * das ueberschreibt die WP-Preset-Variablen, die theme.json fuer * `body` und `display` ausliefert. Headings nutzen ihre eigene * font-weight-Override pro Preset (Bebas Neue kennt nur 400). * * Pfade in url() sind relativ zu dieser CSS-Datei. */ /* @font-face — Barlow */ @font-face { font-family: 'Barlow'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/barlow-latin-400.woff2') format('woff2'); } @font-face { font-family: 'Barlow'; font-style: normal; font-weight: 500; font-display: swap; src: url('../fonts/barlow-latin-500.woff2') format('woff2'); } @font-face { font-family: 'Barlow'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/barlow-latin-600.woff2') format('woff2'); } @font-face { font-family: 'Barlow'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/barlow-latin-700.woff2') format('woff2'); } /* @font-face — Barlow Condensed */ @font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/barlow-condensed-latin-600.woff2') format('woff2'); } @font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/barlow-condensed-latin-700.woff2') format('woff2'); } /* @font-face — Bebas Neue */ @font-face { font-family: 'Bebas Neue'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/bebas-neue-latin-400.woff2') format('woff2'); } /* @font-face — Source Sans 3 */ @font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/source-sans-3-latin-400.woff2') format('woff2'); } @font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/source-sans-3-latin-600.woff2') format('woff2'); } @font-face { font-family: 'Source Sans 3'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/source-sans-3-latin-700.woff2') format('woff2'); } /* @font-face — Inter */ @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: swap; src: url('../fonts/inter-latin-400.woff2') format('woff2'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: swap; src: url('../fonts/inter-latin-600.woff2') format('woff2'); } @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: swap; src: url('../fonts/inter-latin-700.woff2') format('woff2'); } /* * Preset-Overrides. * * theme.json definiert `--wp--preset--font-family--body` (Avenir Next-Stack) * und `--wp--preset--font-family--display` (Avenir Next Condensed-Stack). * Body- und Heading-Styles greifen via `var:preset|font-family|...` darauf zu, * daher genuegt ein Re-Define der gleichen Variablen pro Preset. * * Heading-font-weight bekommt einen eigenen Override, weil theme.json * `elements.heading.fontWeight: 700` fest setzt — fuer Bebas Neue (nur 400) * waere das eine fehlende Datei und ein synthetisches Bold im Browser. */ /* * System-Preset: Stack aus modernen System-UI-Schriften und kraeftigere * font-weights — Body 500, Headings 700 — damit die Default-Darstellung * etwas mehr Substanz bekommt. Wirkt auch wenn `system` der aufgeloeste * Netzwerk-Default ist (kein Webfont laden, aber weight aufwerten). */ :root[data-font-preset="system"] { --wp--preset--font-family--body: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; --wp--preset--font-family--display: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; } :root[data-font-preset="system"] body, :root[data-font-preset="system"] p, :root[data-font-preset="system"] li { font-weight: 500; } :root[data-font-preset="system"] :where(h1, h2, h3, h4) { font-weight: 700; } :root[data-font-preset="barlow"] { --wp--preset--font-family--body: 'Barlow', system-ui, -apple-system, sans-serif; --wp--preset--font-family--display: 'Barlow Condensed', 'Barlow', system-ui, -apple-system, sans-serif; } :root[data-font-preset="bebas"] { --wp--preset--font-family--body: 'Source Sans 3', system-ui, -apple-system, sans-serif; --wp--preset--font-family--display: 'Bebas Neue', 'Source Sans 3', system-ui, -apple-system, sans-serif; } :root[data-font-preset="bebas"] :where(h1, h2, h3, h4, h5, h6) { font-weight: 400; letter-spacing: 0.01em; } :root[data-font-preset="inter"] { --wp--preset--font-family--body: 'Inter', system-ui, -apple-system, sans-serif; --wp--preset--font-family--display: 'Inter', system-ui, -apple-system, sans-serif; }