Layer the token files and keep their utilities apart
Plan step 33. Each token file now opens with the material layer statement and wraps its declarations in material.tokens (the font face in material.base), so an application's unlayered scheme outranks the package default whatever the selectors, and the foundation can import the files with no layer() on the import. The type-* and state utilities move to tokens/utilities.css, still imported by material.css, so no file the foundation imports carries a Tailwind directive. [x-cloak] moves beside the [hidden] rule in foundation/hidden.css, outside every layer; material.css imports it. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Qwx5USif3wFFmxtHg5U1g9
This commit is contained in:
Andreas Reinhold / reini
co-authored by
Claude Opus 5
Claude Opus 5
parent
9942e98fdd
commit
5f899c7287
+422
-414
@@ -11,431 +11,439 @@
|
||||
* data-contrast — which the head script writes from the visitor's choice, or from the
|
||||
* operating system's contrast setting while that choice is `system`. No media query
|
||||
* decides here, as none decides the theme.
|
||||
*
|
||||
* This is the package's default scheme, so the generated blocks are wrapped in
|
||||
* `material.tokens` behind the layer statement (keep both when regenerating into this file): an
|
||||
* application's own scheme, written unlayered, outranks it whatever the selectors.
|
||||
*/
|
||||
|
||||
:root,
|
||||
[data-theme='light'] {
|
||||
color-scheme: light;
|
||||
@layer material.reset, material.tokens, material.base, material.layout, material.components, material.text, material.visibility;
|
||||
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #34313a;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #34313a;
|
||||
--md-sys-color-on-surface-variant: #615d68;
|
||||
--md-sys-color-outline: #7d7983;
|
||||
--md-sys-color-outline-variant: #b5b0bb;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #a09ba1;
|
||||
--md-sys-color-primary: #655789;
|
||||
--md-sys-color-primary-dim: #594b7c;
|
||||
--md-sys-color-on-primary: #fdf7ff;
|
||||
--md-sys-color-primary-container: #d4c3fd;
|
||||
--md-sys-color-on-primary-container: #493c6c;
|
||||
--md-sys-color-primary-fixed: #d4c3fd;
|
||||
--md-sys-color-primary-fixed-dim: #c6b6ee;
|
||||
--md-sys-color-on-primary-fixed: #352857;
|
||||
--md-sys-color-on-primary-fixed-variant: #524576;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #625c71;
|
||||
--md-sys-color-secondary-dim: #565065;
|
||||
--md-sys-color-on-secondary: #fdf7ff;
|
||||
--md-sys-color-secondary-container: #e8def8;
|
||||
--md-sys-color-on-secondary-container: #554f63;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #7b5270;
|
||||
--md-sys-color-tertiary-dim: #6e4664;
|
||||
--md-sys-color-on-tertiary: #fff7f9;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #a8364b;
|
||||
--md-sys-color-error-dim: #6b0221;
|
||||
--md-sys-color-on-error: #fff7f7;
|
||||
--md-sys-color-error-container: #f97386;
|
||||
--md-sys-color-on-error-container: #6e0523;
|
||||
--md-sys-color-success: #006d46;
|
||||
--md-sys-color-on-success: #e7ffed;
|
||||
--md-sys-color-success-container: #86f9bc;
|
||||
--md-sys-color-on-success-container: #00734a;
|
||||
--md-sys-color-warning: #7c5900;
|
||||
--md-sys-color-on-warning: #fff8f1;
|
||||
--md-sys-color-warning-container: #fab925;
|
||||
--md-sys-color-on-warning-container: #6a4b00;
|
||||
--md-sys-color-info: #005bc5;
|
||||
--md-sys-color-on-info: #f9f8ff;
|
||||
--md-sys-color-info-container: #1c7afc;
|
||||
--md-sys-color-on-info-container: #001435;
|
||||
--md-sys-color-inverse-error: #f97386;
|
||||
--md-sys-color-inverse-success: #3bb27b;
|
||||
--md-sys-color-inverse-warning: #f3b31e;
|
||||
--md-sys-color-inverse-info: #699cff;
|
||||
}
|
||||
@layer material.tokens {
|
||||
:root,
|
||||
[data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
[data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #34313a;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #34313a;
|
||||
--md-sys-color-on-surface-variant: #615d68;
|
||||
--md-sys-color-outline: #7d7983;
|
||||
--md-sys-color-outline-variant: #b5b0bb;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #a09ba1;
|
||||
--md-sys-color-primary: #655789;
|
||||
--md-sys-color-primary-dim: #594b7c;
|
||||
--md-sys-color-on-primary: #fdf7ff;
|
||||
--md-sys-color-primary-container: #d4c3fd;
|
||||
--md-sys-color-on-primary-container: #493c6c;
|
||||
--md-sys-color-primary-fixed: #d4c3fd;
|
||||
--md-sys-color-primary-fixed-dim: #c6b6ee;
|
||||
--md-sys-color-on-primary-fixed: #352857;
|
||||
--md-sys-color-on-primary-fixed-variant: #524576;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #625c71;
|
||||
--md-sys-color-secondary-dim: #565065;
|
||||
--md-sys-color-on-secondary: #fdf7ff;
|
||||
--md-sys-color-secondary-container: #e8def8;
|
||||
--md-sys-color-on-secondary-container: #554f63;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #7b5270;
|
||||
--md-sys-color-tertiary-dim: #6e4664;
|
||||
--md-sys-color-on-tertiary: #fff7f9;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #a8364b;
|
||||
--md-sys-color-error-dim: #6b0221;
|
||||
--md-sys-color-on-error: #fff7f7;
|
||||
--md-sys-color-error-container: #f97386;
|
||||
--md-sys-color-on-error-container: #6e0523;
|
||||
--md-sys-color-success: #006d46;
|
||||
--md-sys-color-on-success: #e7ffed;
|
||||
--md-sys-color-success-container: #86f9bc;
|
||||
--md-sys-color-on-success-container: #00734a;
|
||||
--md-sys-color-warning: #7c5900;
|
||||
--md-sys-color-on-warning: #fff8f1;
|
||||
--md-sys-color-warning-container: #fab925;
|
||||
--md-sys-color-on-warning-container: #6a4b00;
|
||||
--md-sys-color-info: #005bc5;
|
||||
--md-sys-color-on-info: #f9f8ff;
|
||||
--md-sys-color-info-container: #1c7afc;
|
||||
--md-sys-color-on-info-container: #001435;
|
||||
--md-sys-color-inverse-error: #f97386;
|
||||
--md-sys-color-inverse-success: #3bb27b;
|
||||
--md-sys-color-inverse-warning: #f3b31e;
|
||||
--md-sys-color-inverse-info: #699cff;
|
||||
}
|
||||
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #eae3ef;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #eae3ef;
|
||||
--md-sys-color-on-surface-variant: #aea9b4;
|
||||
--md-sys-color-outline: #78737e;
|
||||
--md-sys-color-outline-variant: #4a4650;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #575459;
|
||||
--md-sys-color-primary: #cdc0ec;
|
||||
--md-sys-color-primary-dim: #bfb2de;
|
||||
--md-sys-color-on-primary: #443a5f;
|
||||
--md-sys-color-primary-container: #574d72;
|
||||
--md-sys-color-on-primary-container: #e9deff;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #3c3256;
|
||||
--md-sys-color-on-primary-fixed-variant: #594e74;
|
||||
--md-sys-color-inverse-primary: #645980;
|
||||
--md-sys-color-secondary: #cbc2db;
|
||||
--md-sys-color-secondary-dim: #beb5cd;
|
||||
--md-sys-color-on-secondary: #433d51;
|
||||
--md-sys-color-secondary-container: #3e384c;
|
||||
--md-sys-color-on-secondary-container: #c4bbd4;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #ffcfef;
|
||||
--md-sys-color-tertiary-dim: #f4bfe3;
|
||||
--md-sys-color-on-tertiary: #69415f;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #f97386;
|
||||
--md-sys-color-error-dim: #c44b5f;
|
||||
--md-sys-color-on-error: #490013;
|
||||
--md-sys-color-error-container: #871c34;
|
||||
--md-sys-color-on-error-container: #ff97a3;
|
||||
--md-sys-color-success: #3bb27b;
|
||||
--md-sys-color-on-success: #002615;
|
||||
--md-sys-color-success-container: #059460;
|
||||
--md-sys-color-on-success-container: #001e10;
|
||||
--md-sys-color-warning: #f3b31e;
|
||||
--md-sys-color-on-warning: #4e3600;
|
||||
--md-sys-color-warning-container: #e4a604;
|
||||
--md-sys-color-on-warning-container: #593f00;
|
||||
--md-sys-color-info: #699cff;
|
||||
--md-sys-color-on-info: #001e4b;
|
||||
--md-sys-color-info-container: #0c74f6;
|
||||
--md-sys-color-on-info-container: #000a23;
|
||||
--md-sys-color-inverse-error: #a8364b;
|
||||
--md-sys-color-inverse-success: #006d46;
|
||||
--md-sys-color-inverse-warning: #7c5900;
|
||||
--md-sys-color-inverse-info: #005bc5;
|
||||
}
|
||||
[data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
[data-contrast='medium'],
|
||||
[data-contrast='medium'][data-theme='light'],
|
||||
[data-contrast='medium'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #eae3ef;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #eae3ef;
|
||||
--md-sys-color-on-surface-variant: #aea9b4;
|
||||
--md-sys-color-outline: #78737e;
|
||||
--md-sys-color-outline-variant: #4a4650;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #575459;
|
||||
--md-sys-color-primary: #cdc0ec;
|
||||
--md-sys-color-primary-dim: #bfb2de;
|
||||
--md-sys-color-on-primary: #443a5f;
|
||||
--md-sys-color-primary-container: #574d72;
|
||||
--md-sys-color-on-primary-container: #e9deff;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #3c3256;
|
||||
--md-sys-color-on-primary-fixed-variant: #594e74;
|
||||
--md-sys-color-inverse-primary: #645980;
|
||||
--md-sys-color-secondary: #cbc2db;
|
||||
--md-sys-color-secondary-dim: #beb5cd;
|
||||
--md-sys-color-on-secondary: #433d51;
|
||||
--md-sys-color-secondary-container: #3e384c;
|
||||
--md-sys-color-on-secondary-container: #c4bbd4;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #423c50;
|
||||
--md-sys-color-on-secondary-fixed-variant: #5f586e;
|
||||
--md-sys-color-tertiary: #ffcfef;
|
||||
--md-sys-color-tertiary-dim: #f4bfe3;
|
||||
--md-sys-color-on-tertiary: #69415f;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #5f3956;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #4a2642;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #694260;
|
||||
--md-sys-color-error: #f97386;
|
||||
--md-sys-color-error-dim: #c44b5f;
|
||||
--md-sys-color-on-error: #490013;
|
||||
--md-sys-color-error-container: #871c34;
|
||||
--md-sys-color-on-error-container: #ff97a3;
|
||||
--md-sys-color-success: #3bb27b;
|
||||
--md-sys-color-on-success: #002615;
|
||||
--md-sys-color-success-container: #059460;
|
||||
--md-sys-color-on-success-container: #001e10;
|
||||
--md-sys-color-warning: #f3b31e;
|
||||
--md-sys-color-on-warning: #4e3600;
|
||||
--md-sys-color-warning-container: #e4a604;
|
||||
--md-sys-color-on-warning-container: #593f00;
|
||||
--md-sys-color-info: #699cff;
|
||||
--md-sys-color-on-info: #001e4b;
|
||||
--md-sys-color-info-container: #0c74f6;
|
||||
--md-sys-color-on-info-container: #000a23;
|
||||
--md-sys-color-inverse-error: #a8364b;
|
||||
--md-sys-color-inverse-success: #006d46;
|
||||
--md-sys-color-inverse-warning: #7c5900;
|
||||
--md-sys-color-inverse-info: #005bc5;
|
||||
}
|
||||
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #25232b;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #25232b;
|
||||
--md-sys-color-on-surface-variant: #45414b;
|
||||
--md-sys-color-outline: #615d68;
|
||||
--md-sys-color-outline-variant: #7d7983;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #c8c3c9;
|
||||
--md-sys-color-primary: #483b6b;
|
||||
--md-sys-color-primary-dim: #3c305f;
|
||||
--md-sys-color-on-primary: #e1d3ff;
|
||||
--md-sys-color-primary-container: #7b6da0;
|
||||
--md-sys-color-on-primary-container: #ffffff;
|
||||
--md-sys-color-primary-fixed: #7b6da0;
|
||||
--md-sys-color-primary-fixed-dim: #6e6093;
|
||||
--md-sys-color-on-primary-fixed: #ffffff;
|
||||
--md-sys-color-on-primary-fixed-variant: #ffffff;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #464054;
|
||||
--md-sys-color-secondary-dim: #3a3548;
|
||||
--md-sys-color-on-secondary: #dfd5ef;
|
||||
--md-sys-color-secondary-container: #787187;
|
||||
--md-sys-color-on-secondary-container: #ffffff;
|
||||
--md-sys-color-secondary-fixed: #787187;
|
||||
--md-sys-color-secondary-fixed-dim: #6c657b;
|
||||
--md-sys-color-on-secondary-fixed: #ffffff;
|
||||
--md-sys-color-on-secondary-fixed-variant: #ffffff;
|
||||
--md-sys-color-tertiary: #5c3653;
|
||||
--md-sys-color-tertiary-dim: #502b47;
|
||||
--md-sys-color-on-tertiary: #ffcaee;
|
||||
--md-sys-color-tertiary-container: #936787;
|
||||
--md-sys-color-on-tertiary-container: #ffffff;
|
||||
--md-sys-color-tertiary-fixed: #936787;
|
||||
--md-sys-color-tertiary-fixed-dim: #855b7a;
|
||||
--md-sys-color-on-tertiary-fixed: #ffffff;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #ffffff;
|
||||
--md-sys-color-error: #821830;
|
||||
--md-sys-color-error-dim: #6b0221;
|
||||
--md-sys-color-on-error: #ffcdd1;
|
||||
--md-sys-color-error-container: #c44b5f;
|
||||
--md-sys-color-on-error-container: #ffffff;
|
||||
--md-sys-color-success: #004d30;
|
||||
--md-sys-color-on-success: #7df0b3;
|
||||
--md-sys-color-success-container: #008656;
|
||||
--md-sys-color-on-success-container: #ffffff;
|
||||
--md-sys-color-warning: #593e00;
|
||||
--md-sys-color-on-warning: #ffd385;
|
||||
--md-sys-color-warning-container: #986d00;
|
||||
--md-sys-color-on-warning-container: #ffffff;
|
||||
--md-sys-color-info: #003f8e;
|
||||
--md-sys-color-on-info: #cbd9ff;
|
||||
--md-sys-color-info-container: #006fef;
|
||||
--md-sys-color-on-info-container: #ffffff;
|
||||
--md-sys-color-inverse-error: #ff9da8;
|
||||
--md-sys-color-inverse-success: #5ace94;
|
||||
--md-sys-color-inverse-warning: #f3b31e;
|
||||
--md-sys-color-inverse-info: #98b8ff;
|
||||
}
|
||||
[data-contrast='medium'],
|
||||
[data-contrast='medium'][data-theme='light'],
|
||||
[data-contrast='medium'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
[data-contrast='medium'][data-theme='dark'],
|
||||
[data-contrast='medium'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #25232b;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #25232b;
|
||||
--md-sys-color-on-surface-variant: #45414b;
|
||||
--md-sys-color-outline: #615d68;
|
||||
--md-sys-color-outline-variant: #7d7983;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #c8c3c9;
|
||||
--md-sys-color-primary: #483b6b;
|
||||
--md-sys-color-primary-dim: #3c305f;
|
||||
--md-sys-color-on-primary: #e1d3ff;
|
||||
--md-sys-color-primary-container: #7b6da0;
|
||||
--md-sys-color-on-primary-container: #ffffff;
|
||||
--md-sys-color-primary-fixed: #7b6da0;
|
||||
--md-sys-color-primary-fixed-dim: #6e6093;
|
||||
--md-sys-color-on-primary-fixed: #ffffff;
|
||||
--md-sys-color-on-primary-fixed-variant: #ffffff;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #464054;
|
||||
--md-sys-color-secondary-dim: #3a3548;
|
||||
--md-sys-color-on-secondary: #dfd5ef;
|
||||
--md-sys-color-secondary-container: #787187;
|
||||
--md-sys-color-on-secondary-container: #ffffff;
|
||||
--md-sys-color-secondary-fixed: #787187;
|
||||
--md-sys-color-secondary-fixed-dim: #6c657b;
|
||||
--md-sys-color-on-secondary-fixed: #ffffff;
|
||||
--md-sys-color-on-secondary-fixed-variant: #ffffff;
|
||||
--md-sys-color-tertiary: #5c3653;
|
||||
--md-sys-color-tertiary-dim: #502b47;
|
||||
--md-sys-color-on-tertiary: #ffcaee;
|
||||
--md-sys-color-tertiary-container: #936787;
|
||||
--md-sys-color-on-tertiary-container: #ffffff;
|
||||
--md-sys-color-tertiary-fixed: #936787;
|
||||
--md-sys-color-tertiary-fixed-dim: #855b7a;
|
||||
--md-sys-color-on-tertiary-fixed: #ffffff;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #ffffff;
|
||||
--md-sys-color-error: #821830;
|
||||
--md-sys-color-error-dim: #6b0221;
|
||||
--md-sys-color-on-error: #ffcdd1;
|
||||
--md-sys-color-error-container: #c44b5f;
|
||||
--md-sys-color-on-error-container: #ffffff;
|
||||
--md-sys-color-success: #004d30;
|
||||
--md-sys-color-on-success: #7df0b3;
|
||||
--md-sys-color-success-container: #008656;
|
||||
--md-sys-color-on-success-container: #ffffff;
|
||||
--md-sys-color-warning: #593e00;
|
||||
--md-sys-color-on-warning: #ffd385;
|
||||
--md-sys-color-warning-container: #986d00;
|
||||
--md-sys-color-on-warning-container: #ffffff;
|
||||
--md-sys-color-info: #003f8e;
|
||||
--md-sys-color-on-info: #cbd9ff;
|
||||
--md-sys-color-info-container: #006fef;
|
||||
--md-sys-color-on-info-container: #ffffff;
|
||||
--md-sys-color-inverse-error: #ff9da8;
|
||||
--md-sys-color-inverse-success: #5ace94;
|
||||
--md-sys-color-inverse-warning: #f3b31e;
|
||||
--md-sys-color-inverse-info: #98b8ff;
|
||||
}
|
||||
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #ffffff;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #ffffff;
|
||||
--md-sys-color-on-surface-variant: #bcb6c2;
|
||||
--md-sys-color-outline: #96919c;
|
||||
--md-sys-color-outline-variant: #78737e;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #39373c;
|
||||
--md-sys-color-primary: #cdc0ec;
|
||||
--md-sys-color-primary-dim: #bfb2de;
|
||||
--md-sys-color-on-primary: #3a3054;
|
||||
--md-sys-color-primary-container: #7a6f96;
|
||||
--md-sys-color-on-primary-container: #ffffff;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #180e30;
|
||||
--md-sys-color-on-primary-fixed-variant: #3c3256;
|
||||
--md-sys-color-inverse-primary: #5a4f75;
|
||||
--md-sys-color-secondary: #cbc2db;
|
||||
--md-sys-color-secondary-dim: #beb5cd;
|
||||
--md-sys-color-on-secondary: #393347;
|
||||
--md-sys-color-secondary-container: #787187;
|
||||
--md-sys-color-on-secondary-container: #ffffff;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #221d2f;
|
||||
--md-sys-color-on-secondary-fixed-variant: #423c50;
|
||||
--md-sys-color-tertiary: #ffcfef;
|
||||
--md-sys-color-tertiary-dim: #f4bfe3;
|
||||
--md-sys-color-on-tertiary: #5e3855;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #542f4c;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #180015;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #4a2642;
|
||||
--md-sys-color-error: #ff9da8;
|
||||
--md-sys-color-error-dim: #ff8695;
|
||||
--md-sys-color-on-error: #5f001c;
|
||||
--md-sys-color-error-container: #c44b5f;
|
||||
--md-sys-color-on-error-container: #ffffff;
|
||||
--md-sys-color-success: #5ace94;
|
||||
--md-sys-color-on-success: #00341e;
|
||||
--md-sys-color-success-container: #008656;
|
||||
--md-sys-color-on-success-container: #ffffff;
|
||||
--md-sys-color-warning: #f3b31e;
|
||||
--md-sys-color-on-warning: #412d00;
|
||||
--md-sys-color-warning-container: #e4a604;
|
||||
--md-sys-color-on-warning-container: #332200;
|
||||
--md-sys-color-info: #98b8ff;
|
||||
--md-sys-color-on-info: #002a62;
|
||||
--md-sys-color-info-container: #006fef;
|
||||
--md-sys-color-on-info-container: #ffffff;
|
||||
--md-sys-color-inverse-error: #821830;
|
||||
--md-sys-color-inverse-success: #004d30;
|
||||
--md-sys-color-inverse-warning: #593e00;
|
||||
--md-sys-color-inverse-info: #003f8e;
|
||||
}
|
||||
[data-contrast='medium'][data-theme='dark'],
|
||||
[data-contrast='medium'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
[data-contrast='high'],
|
||||
[data-contrast='high'][data-theme='light'],
|
||||
[data-contrast='high'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #ffffff;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #ffffff;
|
||||
--md-sys-color-on-surface-variant: #bcb6c2;
|
||||
--md-sys-color-outline: #96919c;
|
||||
--md-sys-color-outline-variant: #78737e;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #39373c;
|
||||
--md-sys-color-primary: #cdc0ec;
|
||||
--md-sys-color-primary-dim: #bfb2de;
|
||||
--md-sys-color-on-primary: #3a3054;
|
||||
--md-sys-color-primary-container: #7a6f96;
|
||||
--md-sys-color-on-primary-container: #ffffff;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #180e30;
|
||||
--md-sys-color-on-primary-fixed-variant: #3c3256;
|
||||
--md-sys-color-inverse-primary: #5a4f75;
|
||||
--md-sys-color-secondary: #cbc2db;
|
||||
--md-sys-color-secondary-dim: #beb5cd;
|
||||
--md-sys-color-on-secondary: #393347;
|
||||
--md-sys-color-secondary-container: #787187;
|
||||
--md-sys-color-on-secondary-container: #ffffff;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #221d2f;
|
||||
--md-sys-color-on-secondary-fixed-variant: #423c50;
|
||||
--md-sys-color-tertiary: #ffcfef;
|
||||
--md-sys-color-tertiary-dim: #f4bfe3;
|
||||
--md-sys-color-on-tertiary: #5e3855;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #542f4c;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #180015;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #4a2642;
|
||||
--md-sys-color-error: #ff9da8;
|
||||
--md-sys-color-error-dim: #ff8695;
|
||||
--md-sys-color-on-error: #5f001c;
|
||||
--md-sys-color-error-container: #c44b5f;
|
||||
--md-sys-color-on-error-container: #ffffff;
|
||||
--md-sys-color-success: #5ace94;
|
||||
--md-sys-color-on-success: #00341e;
|
||||
--md-sys-color-success-container: #008656;
|
||||
--md-sys-color-on-success-container: #ffffff;
|
||||
--md-sys-color-warning: #f3b31e;
|
||||
--md-sys-color-on-warning: #412d00;
|
||||
--md-sys-color-warning-container: #e4a604;
|
||||
--md-sys-color-on-warning-container: #332200;
|
||||
--md-sys-color-info: #98b8ff;
|
||||
--md-sys-color-on-info: #002a62;
|
||||
--md-sys-color-info-container: #006fef;
|
||||
--md-sys-color-on-info-container: #ffffff;
|
||||
--md-sys-color-inverse-error: #821830;
|
||||
--md-sys-color-inverse-success: #004d30;
|
||||
--md-sys-color-inverse-warning: #593e00;
|
||||
--md-sys-color-inverse-info: #003f8e;
|
||||
}
|
||||
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #000000;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #000000;
|
||||
--md-sys-color-on-surface-variant: #25232b;
|
||||
--md-sys-color-outline: #45414b;
|
||||
--md-sys-color-outline-variant: #54505a;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #ffffff;
|
||||
--md-sys-color-primary: #281b49;
|
||||
--md-sys-color-primary-dim: #1e103f;
|
||||
--md-sys-color-on-primary: #e1d3ff;
|
||||
--md-sys-color-primary-container: #584a7b;
|
||||
--md-sys-color-on-primary-container: #ffffff;
|
||||
--md-sys-color-primary-fixed: #584a7b;
|
||||
--md-sys-color-primary-fixed-dim: #4c3f6f;
|
||||
--md-sys-color-on-primary-fixed: #ffffff;
|
||||
--md-sys-color-on-primary-fixed-variant: #ffffff;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #262134;
|
||||
--md-sys-color-secondary-dim: #1c1729;
|
||||
--md-sys-color-on-secondary: #dfd6ef;
|
||||
--md-sys-color-secondary-container: #554f64;
|
||||
--md-sys-color-on-secondary-container: #ffffff;
|
||||
--md-sys-color-secondary-fixed: #554f64;
|
||||
--md-sys-color-secondary-fixed-dim: #494358;
|
||||
--md-sys-color-on-secondary-fixed: #ffffff;
|
||||
--md-sys-color-on-secondary-fixed-variant: #ffffff;
|
||||
--md-sys-color-tertiary: #391733;
|
||||
--md-sys-color-tertiary-dim: #2e0d28;
|
||||
--md-sys-color-on-tertiary: #ffcbee;
|
||||
--md-sys-color-tertiary-container: #6d4563;
|
||||
--md-sys-color-on-tertiary-container: #ffffff;
|
||||
--md-sys-color-tertiary-fixed: #6d4563;
|
||||
--md-sys-color-tertiary-fixed-dim: #603a57;
|
||||
--md-sys-color-on-tertiary-fixed: #ffffff;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #ffffff;
|
||||
--md-sys-color-error: #500016;
|
||||
--md-sys-color-error-dim: #3d000f;
|
||||
--md-sys-color-on-error: #ffced2;
|
||||
--md-sys-color-error-container: #97283e;
|
||||
--md-sys-color-on-error-container: #ffffff;
|
||||
--md-sys-color-success: #002a18;
|
||||
--md-sys-color-on-success: #7df0b4;
|
||||
--md-sys-color-success-container: #005f3c;
|
||||
--md-sys-color-on-success-container: #ffffff;
|
||||
--md-sys-color-warning: #312100;
|
||||
--md-sys-color-on-warning: #ffd486;
|
||||
--md-sys-color-warning-container: #6c4d00;
|
||||
--md-sys-color-on-warning-container: #ffffff;
|
||||
--md-sys-color-info: #002252;
|
||||
--md-sys-color-on-info: #ccdaff;
|
||||
--md-sys-color-info-container: #004eac;
|
||||
--md-sys-color-on-info-container: #ffffff;
|
||||
--md-sys-color-inverse-error: #ffdddf;
|
||||
--md-sys-color-inverse-success: #89fcbf;
|
||||
--md-sys-color-inverse-warning: #ffe2b1;
|
||||
--md-sys-color-inverse-info: #dde5ff;
|
||||
}
|
||||
[data-contrast='high'],
|
||||
[data-contrast='high'][data-theme='light'],
|
||||
[data-contrast='high'] [data-theme='light'] {
|
||||
color-scheme: light;
|
||||
|
||||
[data-contrast='high'][data-theme='dark'],
|
||||
[data-contrast='high'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
--md-sys-color-background: #fdf7fe;
|
||||
--md-sys-color-on-background: #000000;
|
||||
--md-sys-color-surface: #fdf7fe;
|
||||
--md-sys-color-surface-dim: #ded8e4;
|
||||
--md-sys-color-surface-bright: #fdf7fe;
|
||||
--md-sys-color-surface-container-lowest: #ffffff;
|
||||
--md-sys-color-surface-container-low: #f8f1fa;
|
||||
--md-sys-color-surface-container: #f2ecf5;
|
||||
--md-sys-color-surface-container-high: #ece6f0;
|
||||
--md-sys-color-surface-container-highest: #e7e0ec;
|
||||
--md-sys-color-on-surface: #000000;
|
||||
--md-sys-color-on-surface-variant: #25232b;
|
||||
--md-sys-color-outline: #45414b;
|
||||
--md-sys-color-outline-variant: #54505a;
|
||||
--md-sys-color-inverse-surface: #0f0d12;
|
||||
--md-sys-color-inverse-on-surface: #ffffff;
|
||||
--md-sys-color-primary: #281b49;
|
||||
--md-sys-color-primary-dim: #1e103f;
|
||||
--md-sys-color-on-primary: #e1d3ff;
|
||||
--md-sys-color-primary-container: #584a7b;
|
||||
--md-sys-color-on-primary-container: #ffffff;
|
||||
--md-sys-color-primary-fixed: #584a7b;
|
||||
--md-sys-color-primary-fixed-dim: #4c3f6f;
|
||||
--md-sys-color-on-primary-fixed: #ffffff;
|
||||
--md-sys-color-on-primary-fixed-variant: #ffffff;
|
||||
--md-sys-color-inverse-primary: #d4c3fd;
|
||||
--md-sys-color-secondary: #262134;
|
||||
--md-sys-color-secondary-dim: #1c1729;
|
||||
--md-sys-color-on-secondary: #dfd6ef;
|
||||
--md-sys-color-secondary-container: #554f64;
|
||||
--md-sys-color-on-secondary-container: #ffffff;
|
||||
--md-sys-color-secondary-fixed: #554f64;
|
||||
--md-sys-color-secondary-fixed-dim: #494358;
|
||||
--md-sys-color-on-secondary-fixed: #ffffff;
|
||||
--md-sys-color-on-secondary-fixed-variant: #ffffff;
|
||||
--md-sys-color-tertiary: #391733;
|
||||
--md-sys-color-tertiary-dim: #2e0d28;
|
||||
--md-sys-color-on-tertiary: #ffcbee;
|
||||
--md-sys-color-tertiary-container: #6d4563;
|
||||
--md-sys-color-on-tertiary-container: #ffffff;
|
||||
--md-sys-color-tertiary-fixed: #6d4563;
|
||||
--md-sys-color-tertiary-fixed-dim: #603a57;
|
||||
--md-sys-color-on-tertiary-fixed: #ffffff;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #ffffff;
|
||||
--md-sys-color-error: #500016;
|
||||
--md-sys-color-error-dim: #3d000f;
|
||||
--md-sys-color-on-error: #ffced2;
|
||||
--md-sys-color-error-container: #97283e;
|
||||
--md-sys-color-on-error-container: #ffffff;
|
||||
--md-sys-color-success: #002a18;
|
||||
--md-sys-color-on-success: #7df0b4;
|
||||
--md-sys-color-success-container: #005f3c;
|
||||
--md-sys-color-on-success-container: #ffffff;
|
||||
--md-sys-color-warning: #312100;
|
||||
--md-sys-color-on-warning: #ffd486;
|
||||
--md-sys-color-warning-container: #6c4d00;
|
||||
--md-sys-color-on-warning-container: #ffffff;
|
||||
--md-sys-color-info: #002252;
|
||||
--md-sys-color-on-info: #ccdaff;
|
||||
--md-sys-color-info-container: #004eac;
|
||||
--md-sys-color-on-info-container: #ffffff;
|
||||
--md-sys-color-inverse-error: #ffdddf;
|
||||
--md-sys-color-inverse-success: #89fcbf;
|
||||
--md-sys-color-inverse-warning: #ffe2b1;
|
||||
--md-sys-color-inverse-info: #dde5ff;
|
||||
}
|
||||
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #ffffff;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #ffffff;
|
||||
--md-sys-color-on-surface-variant: #eae3ef;
|
||||
--md-sys-color-outline: #bcb6c2;
|
||||
--md-sys-color-outline-variant: #a7a1ad;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #000000;
|
||||
--md-sys-color-primary: #ebe1ff;
|
||||
--md-sys-color-primary-dim: #ded0fe;
|
||||
--md-sys-color-on-primary: #302649;
|
||||
--md-sys-color-primary-container: #aa9dc8;
|
||||
--md-sys-color-on-primary-container: #000000;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #000000;
|
||||
--md-sys-color-on-primary-fixed-variant: #180e30;
|
||||
--md-sys-color-inverse-primary: #3c3256;
|
||||
--md-sys-color-secondary: #ebe1fb;
|
||||
--md-sys-color-secondary-dim: #ddd3ed;
|
||||
--md-sys-color-on-secondary: #2e293c;
|
||||
--md-sys-color-secondary-container: #a8a0b8;
|
||||
--md-sys-color-on-secondary-container: #000000;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #000000;
|
||||
--md-sys-color-on-secondary-fixed-variant: #221d2f;
|
||||
--md-sys-color-tertiary: #ffdbf2;
|
||||
--md-sys-color-tertiary-dim: #fac5e9;
|
||||
--md-sys-color-on-tertiary: #43203b;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #2e0e29;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #000000;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #180015;
|
||||
--md-sys-color-error: #ffdddf;
|
||||
--md-sys-color-error-dim: #ffc7cb;
|
||||
--md-sys-color-on-error: #5f001c;
|
||||
--md-sys-color-error-container: #ff798c;
|
||||
--md-sys-color-on-error-container: #000000;
|
||||
--md-sys-color-success: #89fcbf;
|
||||
--md-sys-color-on-success: #00341e;
|
||||
--md-sys-color-success-container: #42b880;
|
||||
--md-sys-color-on-success-container: #000000;
|
||||
--md-sys-color-warning: #ffe2b1;
|
||||
--md-sys-color-on-warning: #3c2900;
|
||||
--md-sys-color-warning-container: #e4a604;
|
||||
--md-sys-color-on-warning-container: #000000;
|
||||
--md-sys-color-info: #dde5ff;
|
||||
--md-sys-color-on-info: #002a62;
|
||||
--md-sys-color-info-container: #74a2ff;
|
||||
--md-sys-color-on-info-container: #000000;
|
||||
--md-sys-color-inverse-error: #500016;
|
||||
--md-sys-color-inverse-success: #002a18;
|
||||
--md-sys-color-inverse-warning: #312100;
|
||||
--md-sys-color-inverse-info: #002252;
|
||||
[data-contrast='high'][data-theme='dark'],
|
||||
[data-contrast='high'] [data-theme='dark'] {
|
||||
color-scheme: dark;
|
||||
|
||||
--md-sys-color-background: #0f0d12;
|
||||
--md-sys-color-on-background: #ffffff;
|
||||
--md-sys-color-surface: #0f0d12;
|
||||
--md-sys-color-surface-dim: #0f0d12;
|
||||
--md-sys-color-surface-bright: #2e2b34;
|
||||
--md-sys-color-surface-container-lowest: #000000;
|
||||
--md-sys-color-surface-container-low: #141218;
|
||||
--md-sys-color-surface-container: #1b181f;
|
||||
--md-sys-color-surface-container-high: #211e26;
|
||||
--md-sys-color-surface-container-highest: #27242d;
|
||||
--md-sys-color-on-surface: #ffffff;
|
||||
--md-sys-color-on-surface-variant: #eae3ef;
|
||||
--md-sys-color-outline: #bcb6c2;
|
||||
--md-sys-color-outline-variant: #a7a1ad;
|
||||
--md-sys-color-inverse-surface: #fdf7fe;
|
||||
--md-sys-color-inverse-on-surface: #000000;
|
||||
--md-sys-color-primary: #ebe1ff;
|
||||
--md-sys-color-primary-dim: #ded0fe;
|
||||
--md-sys-color-on-primary: #302649;
|
||||
--md-sys-color-primary-container: #aa9dc8;
|
||||
--md-sys-color-on-primary-container: #000000;
|
||||
--md-sys-color-primary-fixed: #ded0fe;
|
||||
--md-sys-color-primary-fixed-dim: #d0c3ef;
|
||||
--md-sys-color-on-primary-fixed: #000000;
|
||||
--md-sys-color-on-primary-fixed-variant: #180e30;
|
||||
--md-sys-color-inverse-primary: #3c3256;
|
||||
--md-sys-color-secondary: #ebe1fb;
|
||||
--md-sys-color-secondary-dim: #ddd3ed;
|
||||
--md-sys-color-on-secondary: #2e293c;
|
||||
--md-sys-color-secondary-container: #a8a0b8;
|
||||
--md-sys-color-on-secondary-container: #000000;
|
||||
--md-sys-color-secondary-fixed: #e8def8;
|
||||
--md-sys-color-secondary-fixed-dim: #dad0ea;
|
||||
--md-sys-color-on-secondary-fixed: #000000;
|
||||
--md-sys-color-on-secondary-fixed-variant: #221d2f;
|
||||
--md-sys-color-tertiary: #ffdbf2;
|
||||
--md-sys-color-tertiary-dim: #fac5e9;
|
||||
--md-sys-color-on-tertiary: #43203b;
|
||||
--md-sys-color-tertiary-container: #f4bfe3;
|
||||
--md-sys-color-on-tertiary-container: #2e0e29;
|
||||
--md-sys-color-tertiary-fixed: #f4bfe3;
|
||||
--md-sys-color-tertiary-fixed-dim: #e5b2d5;
|
||||
--md-sys-color-on-tertiary-fixed: #000000;
|
||||
--md-sys-color-on-tertiary-fixed-variant: #180015;
|
||||
--md-sys-color-error: #ffdddf;
|
||||
--md-sys-color-error-dim: #ffc7cb;
|
||||
--md-sys-color-on-error: #5f001c;
|
||||
--md-sys-color-error-container: #ff798c;
|
||||
--md-sys-color-on-error-container: #000000;
|
||||
--md-sys-color-success: #89fcbf;
|
||||
--md-sys-color-on-success: #00341e;
|
||||
--md-sys-color-success-container: #42b880;
|
||||
--md-sys-color-on-success-container: #000000;
|
||||
--md-sys-color-warning: #ffe2b1;
|
||||
--md-sys-color-on-warning: #3c2900;
|
||||
--md-sys-color-warning-container: #e4a604;
|
||||
--md-sys-color-on-warning-container: #000000;
|
||||
--md-sys-color-info: #dde5ff;
|
||||
--md-sys-color-on-info: #002a62;
|
||||
--md-sys-color-info-container: #74a2ff;
|
||||
--md-sys-color-on-info-container: #000000;
|
||||
--md-sys-color-inverse-error: #500016;
|
||||
--md-sys-color-inverse-success: #002a18;
|
||||
--md-sys-color-inverse-warning: #312100;
|
||||
--md-sys-color-inverse-info: #002252;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user