146 lines
3.8 KiB
CSS
146 lines
3.8 KiB
CSS
/* Inference Cooperative brand layer for the documentation site.
|
|
*
|
|
* Source of truth: the co-op's website (repos/website/index.html) — its CSS
|
|
* custom properties and its Figtree webfont. This file reuses those values so
|
|
* the documentation reads as the same organisation, not a default theme.
|
|
*
|
|
* Standing constraint: everything here is local. No third-party font service,
|
|
* no CDN, no other external host.
|
|
*/
|
|
|
|
:root {
|
|
/* -- the co-op's palette (copied from repos/website/index.html) -- */
|
|
--cream: #faf8f5;
|
|
--white: #ffffff;
|
|
--ink: #2d3327;
|
|
--muted: #6b7a62;
|
|
--light-muted: #94a08c;
|
|
--green-deep: #5b8c5a;
|
|
--green-mid: #6ba86b;
|
|
--green-light: #7ab87a;
|
|
--border: #e8e2d8;
|
|
--wash: #eef4ea;
|
|
--earth-red: #a04b3a;
|
|
--earth-red-wash: #f3e6e1;
|
|
--bronze: #a97a4a;
|
|
--bronze-wash: #f1e8da;
|
|
}
|
|
|
|
/* ---------- Material for MkDocs: map the palette onto the theme ---------- */
|
|
|
|
:root,
|
|
[data-md-color-scheme="default"] {
|
|
--md-default-bg-color: var(--cream);
|
|
--md-primary-fg-color: var(--green-deep);
|
|
--md-primary-fg-color--light: var(--green-mid);
|
|
--md-primary-fg-color--dark: #4a7a49;
|
|
--md-primary-bg-color: var(--cream);
|
|
--md-accent-fg-color: var(--earth-red);
|
|
--md-typeset-a-color: var(--green-deep);
|
|
--md-typeset-color: var(--ink);
|
|
--md-footer-bg-color: var(--wash);
|
|
--md-footer-fg-color: var(--ink);
|
|
--md-footer-fg-color--light: var(--muted);
|
|
--md-code-bg-color: #f2efe9;
|
|
--md-code-fg-color: var(--ink);
|
|
--md-admonition-bg-color: var(--wash);
|
|
}
|
|
|
|
/* Dark scheme keeps the same accents; light stays the default. */
|
|
[data-md-color-scheme="slate"] {
|
|
--md-primary-fg-color: #3f6b3e;
|
|
--md-accent-fg-color: #d98a75;
|
|
--md-typeset-a-color: var(--green-light);
|
|
--md-code-bg-color: #2e3328;
|
|
--md-code-fg-color: #e8e2d8;
|
|
}
|
|
|
|
/* ---------- Typography: Figtree, self-hosted (SIL OFL 1.1) ---------- */
|
|
|
|
@font-face {
|
|
font-family: "Figtree";
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
font-display: swap;
|
|
src: url("fonts/figtree-400.woff2") format("woff2");
|
|
}
|
|
@font-face {
|
|
font-family: "Figtree";
|
|
font-style: normal;
|
|
font-weight: 500;
|
|
font-display: swap;
|
|
src: url("fonts/figtree-500.woff2") format("woff2");
|
|
}
|
|
@font-face {
|
|
font-family: "Figtree";
|
|
font-style: normal;
|
|
font-weight: 600;
|
|
font-display: swap;
|
|
src: url("fonts/figtree-600.woff2") format("woff2");
|
|
}
|
|
@font-face {
|
|
font-family: "Figtree";
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
font-display: swap;
|
|
src: url("fonts/figtree-700.woff2") format("woff2");
|
|
}
|
|
|
|
:root {
|
|
--md-text-font-family: "Figtree", system-ui, -apple-system, "Segoe UI",
|
|
Roboto, "Helvetica Neue", Arial, sans-serif;
|
|
--md-code-font-family: ui-monospace, "SFMono-Regular", "Cascadia Mono",
|
|
"Segoe UI Mono", Menlo, Consolas, monospace;
|
|
}
|
|
|
|
/* ---------- Friendly details ---------- */
|
|
|
|
/* Links read like the website's: brand green, semibold, underline on hover. */
|
|
.md-typeset a {
|
|
font-weight: 600;
|
|
}
|
|
.md-typeset a:hover,
|
|
.md-typeset a:focus {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
/* Rounder cards and tables; a wash instead of grey where the theme has one. */
|
|
.md-typeset .grid.cards > ul > li,
|
|
.md-typeset .grid > .card,
|
|
.md-typeset table:not([class]) {
|
|
border-radius: 0.6rem;
|
|
}
|
|
.md-typeset table:not([class]) {
|
|
border: 1px solid var(--border);
|
|
}
|
|
|
|
/* Header: co-op green with the cream wordmark. */
|
|
.md-header {
|
|
box-shadow: none;
|
|
border-bottom: 1px solid rgba(255, 255, 255, 0.25);
|
|
}
|
|
.md-header .md-header__title {
|
|
font-weight: 600;
|
|
}
|
|
|
|
/* Tabs and the search field pick up the wash. */
|
|
.md-tabs {
|
|
background-color: var(--green-deep);
|
|
}
|
|
.md-search__input {
|
|
background-color: rgba(255, 255, 255, 0.92);
|
|
}
|
|
|
|
/* Admonitions get the co-op's washes instead of stock greys. */
|
|
.md-typeset .admonition,
|
|
.md-typeset details {
|
|
border-radius: 0.6rem;
|
|
}
|
|
.md-typeset .admonition.tip,
|
|
.md-typeset .admonition.note {
|
|
border-color: var(--green-mid);
|
|
}
|
|
.md-typeset .admonition.warning {
|
|
border-color: var(--earth-red);
|
|
}
|