98 lines
3.4 KiB
CSS
98 lines
3.4 KiB
CSS
:root {
|
|
--font-body: "Plus Jakarta Sans", "Segoe UI", sans-serif;
|
|
--font-heading: "DM Serif Text", "Georgia", serif;
|
|
--font-code: "JetBrains Mono", "Fira Code", monospace;
|
|
|
|
--md-sys-color-primary: #73594d;
|
|
--md-sys-color-on-primary: #ffffff;
|
|
--md-sys-color-primary-container: #fbded0;
|
|
--md-sys-color-on-primary-container: #2b160f;
|
|
--md-sys-color-primary-tint: rgba(115, 89, 77, 0.18);
|
|
|
|
--md-sys-color-secondary: #6f5b52;
|
|
--md-sys-color-on-secondary: #ffffff;
|
|
--md-sys-color-secondary-container: #f8ddd2;
|
|
--md-sys-color-on-secondary-container: #281913;
|
|
|
|
--md-sys-color-tertiary: #5b6550;
|
|
--md-sys-color-on-tertiary: #ffffff;
|
|
--md-sys-color-tertiary-container: #ddebcf;
|
|
--md-sys-color-on-tertiary-container: #17200f;
|
|
|
|
--md-sys-color-error: #b3261e;
|
|
--md-sys-color-on-error: #ffffff;
|
|
--md-sys-color-error-container: #f9dedc;
|
|
--md-sys-color-on-error-container: #410e0b;
|
|
|
|
--md-sys-color-surface: #fff8f5;
|
|
--md-sys-color-surface-tint: rgba(111, 87, 74, 0.12);
|
|
--md-sys-color-surface-container-low: #fffaf8;
|
|
--md-sys-color-surface-container: #fdf2ec;
|
|
--md-sys-color-surface-container-high: #f8e9e1;
|
|
--md-sys-color-on-surface: #221a17;
|
|
--md-sys-color-on-surface-variant: #55423a;
|
|
--md-sys-color-outline: #85736b;
|
|
--md-sys-color-outline-variant: #d8c2b8;
|
|
|
|
--elevation-card: 0 10px 30px rgba(55, 39, 28, 0.08);
|
|
}
|
|
|
|
:root[data-theme="fjord"] {
|
|
--md-sys-color-primary: #2f6678;
|
|
--md-sys-color-on-primary: #ffffff;
|
|
--md-sys-color-primary-container: #cde9f4;
|
|
--md-sys-color-on-primary-container: #051f28;
|
|
--md-sys-color-primary-tint: rgba(47, 102, 120, 0.2);
|
|
|
|
--md-sys-color-secondary: #4d626b;
|
|
--md-sys-color-on-secondary: #ffffff;
|
|
--md-sys-color-secondary-container: #d0e6f2;
|
|
--md-sys-color-on-secondary-container: #091f27;
|
|
|
|
--md-sys-color-tertiary: #456179;
|
|
--md-sys-color-on-tertiary: #ffffff;
|
|
--md-sys-color-tertiary-container: #d2e5ff;
|
|
--md-sys-color-on-tertiary-container: #031d33;
|
|
|
|
--md-sys-color-surface: #f5fbff;
|
|
--md-sys-color-surface-tint: rgba(47, 102, 120, 0.12);
|
|
--md-sys-color-surface-container-low: #fcfeff;
|
|
--md-sys-color-surface-container: #ecf5fa;
|
|
--md-sys-color-surface-container-high: #dfeef6;
|
|
--md-sys-color-on-surface: #172126;
|
|
--md-sys-color-on-surface-variant: #3f4f57;
|
|
--md-sys-color-outline: #6f7f88;
|
|
--md-sys-color-outline-variant: #becfd8;
|
|
|
|
--elevation-card: 0 10px 30px rgba(22, 43, 53, 0.09);
|
|
}
|
|
|
|
:root[data-theme="spruce"] {
|
|
--md-sys-color-primary: #39684c;
|
|
--md-sys-color-on-primary: #ffffff;
|
|
--md-sys-color-primary-container: #bcefc9;
|
|
--md-sys-color-on-primary-container: #062111;
|
|
--md-sys-color-primary-tint: rgba(57, 104, 76, 0.18);
|
|
|
|
--md-sys-color-secondary: #4f6354;
|
|
--md-sys-color-on-secondary: #ffffff;
|
|
--md-sys-color-secondary-container: #d2e8d4;
|
|
--md-sys-color-on-secondary-container: #0d1f12;
|
|
|
|
--md-sys-color-tertiary: #3f655f;
|
|
--md-sys-color-on-tertiary: #ffffff;
|
|
--md-sys-color-tertiary-container: #c2ece4;
|
|
--md-sys-color-on-tertiary-container: #021f1a;
|
|
|
|
--md-sys-color-surface: #f5fbf5;
|
|
--md-sys-color-surface-tint: rgba(57, 104, 76, 0.1);
|
|
--md-sys-color-surface-container-low: #fcfffb;
|
|
--md-sys-color-surface-container: #ebf4ea;
|
|
--md-sys-color-surface-container-high: #deecdd;
|
|
--md-sys-color-on-surface: #172119;
|
|
--md-sys-color-on-surface-variant: #415246;
|
|
--md-sys-color-outline: #708174;
|
|
--md-sys-color-outline-variant: #c1d3c2;
|
|
|
|
--elevation-card: 0 10px 30px rgba(24, 48, 32, 0.08);
|
|
}
|