style: switch site font to Cascadia Code
This commit is contained in:
parent
5e4e75dfb3
commit
69d0986dc9
3 changed files with 20 additions and 11 deletions
|
|
@ -1,9 +1,9 @@
|
||||||
/* Leaflet map CSS (vendored) */
|
/* Leaflet map CSS (vendored) */
|
||||||
@import "../vendor/leaflet/leaflet.css";
|
@import "../vendor/leaflet/leaflet.css";
|
||||||
|
|
||||||
/* Inter — primary UI font. Design spec calls for weights 400/500/600/700.
|
/* Cascadia Code as the single project font. Google Fonts doesn't
|
||||||
JetBrains Mono kept as escape hatch for code blocks. */
|
ship it — fonts.cdnfonts.com mirrors Microsoft's release. */
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap');
|
@import url('https://fonts.cdnfonts.com/css/cascadia-code');
|
||||||
|
|
||||||
/* See the Tailwind configuration guide for advanced usage
|
/* See the Tailwind configuration guide for advanced usage
|
||||||
https://tailwindcss.com/docs/configuration */
|
https://tailwindcss.com/docs/configuration */
|
||||||
|
|
@ -15,6 +15,15 @@
|
||||||
@source "../../deps/live_table/lib";
|
@source "../../deps/live_table/lib";
|
||||||
@source "../../deps/sutra_ui/lib";
|
@source "../../deps/sutra_ui/lib";
|
||||||
|
|
||||||
|
/* Map both Tailwind font families onto Cascadia Code so any element
|
||||||
|
hard-coded to font-sans or font-mono picks up the project font.
|
||||||
|
Keep the system fallbacks so the page is still readable while the
|
||||||
|
webfont network request is in flight. */
|
||||||
|
@theme {
|
||||||
|
--font-sans: "Cascadia Code", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||||
|
--font-mono: "Cascadia Code", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
|
||||||
|
}
|
||||||
|
|
||||||
/* live_table / sutra_ui compat: maps shadcn tokens live_table uses to
|
/* live_table / sutra_ui compat: maps shadcn tokens live_table uses to
|
||||||
daisyUI base colors and provides component CSS for the SutraUI
|
daisyUI base colors and provides component CSS for the SutraUI
|
||||||
primitives wrapped by live_table (select, input-group, dropdown,
|
primitives wrapped by live_table (select, input-group, dropdown,
|
||||||
|
|
@ -166,13 +175,13 @@
|
||||||
--band-6mm: #0891B2;
|
--band-6mm: #0891B2;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Inter as the default UI font. JetBrains Mono reserved for code blocks.
|
/* Cascadia Code everywhere — UI, body copy, and code. The font is
|
||||||
Callsigns and grid squares are intentionally sans + uppercase (not mono)
|
monospace by design; we tighten letter-spacing slightly so prose
|
||||||
to match product convention. */
|
blocks don't read excessively wide. */
|
||||||
html, body {
|
html, body {
|
||||||
font-family:
|
font-family:
|
||||||
"Inter", ui-sans-serif, system-ui, -apple-system,
|
"Cascadia Code", ui-monospace, SFMono-Regular, "Menlo", "Consolas",
|
||||||
"Segoe UI", Roboto, sans-serif;
|
monospace;
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
text-rendering: optimizeLegibility;
|
text-rendering: optimizeLegibility;
|
||||||
font-variant-numeric: tabular-nums;
|
font-variant-numeric: tabular-nums;
|
||||||
|
|
@ -247,7 +256,7 @@ select.select {
|
||||||
}
|
}
|
||||||
|
|
||||||
.markdown-content code {
|
.markdown-content code {
|
||||||
font-family: ui-monospace, monospace;
|
font-family: "Cascadia Code", ui-monospace, monospace;
|
||||||
font-size: 0.875em;
|
font-size: 0.875em;
|
||||||
background: var(--color-base-300);
|
background: var(--color-base-300);
|
||||||
padding: 0.15em 0.35em;
|
padding: 0.15em 0.35em;
|
||||||
|
|
|
||||||
|
|
@ -55,7 +55,7 @@ function buildHTML(detail: PathForecastDetail): string {
|
||||||
const pct = Math.round(meta.weight * 100)
|
const pct = Math.round(meta.weight * 100)
|
||||||
rows += `<tr>
|
rows += `<tr>
|
||||||
<td style="padding:1px 6px 1px 0;white-space:nowrap;font-size:11px;">${meta.label}</td>
|
<td style="padding:1px 6px 1px 0;white-space:nowrap;font-size:11px;">${meta.label}</td>
|
||||||
<td style="padding:1px 4px;font-family:monospace;font-size:11px;letter-spacing:-0.5px;">${factorBar(value)}</td>
|
<td style="padding:1px 4px;font-family:'Cascadia Code',monospace;font-size:11px;letter-spacing:-0.5px;">${factorBar(value)}</td>
|
||||||
<td style="padding:1px 4px;text-align:right;font-size:11px;font-weight:600;">${value}</td>
|
<td style="padding:1px 4px;text-align:right;font-size:11px;font-weight:600;">${value}</td>
|
||||||
<td style="padding:1px 4px;font-size:10px;opacity:0.5;">(${pct}%)</td>
|
<td style="padding:1px 4px;font-size:10px;opacity:0.5;">(${pct}%)</td>
|
||||||
</tr>`
|
</tr>`
|
||||||
|
|
|
||||||
|
|
@ -590,7 +590,7 @@ function buildPopupHTML(detail: PointDetail, viewshedLoading: boolean): string {
|
||||||
const pct = Math.round(meta.weight * 100)
|
const pct = Math.round(meta.weight * 100)
|
||||||
rows += `<tr>
|
rows += `<tr>
|
||||||
<td style="padding:1px 6px 1px 0;white-space:nowrap;font-size:11px;">${meta.label}</td>
|
<td style="padding:1px 6px 1px 0;white-space:nowrap;font-size:11px;">${meta.label}</td>
|
||||||
<td style="padding:1px 4px;font-family:monospace;font-size:11px;letter-spacing:-0.5px;">${factorBar(value)}</td>
|
<td style="padding:1px 4px;font-family:'Cascadia Code',monospace;font-size:11px;letter-spacing:-0.5px;">${factorBar(value)}</td>
|
||||||
<td style="padding:1px 4px;text-align:right;font-size:11px;font-weight:600;">${value}</td>
|
<td style="padding:1px 4px;text-align:right;font-size:11px;font-weight:600;">${value}</td>
|
||||||
<td style="padding:1px 4px;font-size:10px;opacity:0.5;">(${pct}%)</td>
|
<td style="padding:1px 4px;font-size:10px;opacity:0.5;">(${pct}%)</td>
|
||||||
</tr>`
|
</tr>`
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue