feat(style): use standard material color

BREAKING CHANGE: palette must update
Alwatr · Nov 14, 2023 · 05cd040 · 05cd040
1 parent c0c6ede
commit 05cd040
Showing 1 changed file with 17 additions and 17 deletions.
diff --git a/packages/style/lib/colors.css b/packages/style/lib/colors.css
@@ -2,28 +2,28 @@
   :root {
     --sys-color-primary: var(--ref-palette-primary40);
     --sys-color-primary-container: var(--ref-palette-primary90);
-    --sys-color-on-primary: var(--ref-palette-primary100);
+    --sys-color-on-primary: 255, 255, 255;
     --sys-color-on-primary-container: var(--ref-palette-primary10);
     --sys-color-inverse-primary: var(--ref-palette-primary80);
 
     --sys-color-secondary: var(--ref-palette-secondary40);
     --sys-color-secondary-container: var(--ref-palette-secondary90);
-    --sys-color-on-secondary: var(--ref-palette-secondary100);
+    --sys-color-on-secondary: 255, 255, 255;
     --sys-color-on-secondary-container: var(--ref-palette-secondary10);
 
     --sys-color-tertiary: var(--ref-palette-tertiary40);
     --sys-color-tertiary-container: var(--ref-palette-tertiary90);
-    --sys-color-on-tertiary: var(--ref-palette-tertiary100);
+    --sys-color-on-tertiary: 255, 255, 255;
     --sys-color-on-tertiary-container: var(--ref-palette-tertiary10);
 
     --sys-color-background: var(--ref-palette-neutral98);
     --sys-color-surface: var(--ref-palette-neutral98);
     --sys-color-surface-bright: var(--ref-palette-neutral98);
-    --sys-color-surface-dim: var(--ref-palette-neutral90); /* 87! */
-    --sys-color-surface-container-lowest: var(--ref-palette-neutral100);
-    --sys-color-surface-container-low: var(--ref-palette-neutral98); /* 86! */
-    --sys-color-surface-container: var(--ref-palette-neutral95); /* 94! */
-    --sys-color-surface-container-high: var(--ref-palette-neutral90); /* 92! */
+    --sys-color-surface-dim: var(--ref-palette-neutral87); /* 87! */
+    --sys-color-surface-container-lowest: 255, 255, 255;
+    --sys-color-surface-container-low: var(--ref-palette-neutral96); /* 96! */
+    --sys-color-surface-container: var(--ref-palette-neutral94); /* 94! */
+    --sys-color-surface-container-high: var(--ref-palette-neutral92); /* 92! */
     --sys-color-surface-container-highest: var(--ref-palette-neutral90);
     --sys-color-surface-variant: var(--ref-palette-neutral-variant90);
     --sys-color-inverse-surface: var(--ref-palette-neutral20);
@@ -38,7 +38,7 @@
 
     --sys-color-error: var(--ref-palette-error40);
     --sys-color-error-container: var(--ref-palette-error90);
-    --sys-color-on-error: var(--ref-palette-error100);
+    --sys-color-on-error: 255, 255, 255;
     --sys-color-on-error-container: var(--ref-palette-error10);
 
     --sys-color-surface-tint: var(--sys-color-primary-hsl);
@@ -48,7 +48,7 @@
 
   @media (prefers-color-scheme: dark) {
     :root {
-      --sys-color-primary: var(--ref-palette-primary60);
+      --sys-color-primary: var(--ref-palette-primary80);
       --sys-color-primary-container: var(--ref-palette-primary30);
       --sys-color-on-primary: var(--ref-palette-primary20);
       --sys-color-on-primary-container: var(--ref-palette-primary90);
@@ -64,15 +64,15 @@
       --sys-color-on-tertiary: var(--ref-palette-tertiary20);
       --sys-color-on-tertiary-container: var(--ref-palette-tertiary90);
 
-      --sys-color-background: var(--ref-palette-neutral10); /* 6! */
-      --sys-color-surface: var(--ref-palette-neutral10); /* 6! */
+      --sys-color-background: var(--ref-palette-neutral6); /* 6! */
+      --sys-color-surface: var(--ref-palette-neutral6); /* 6! */
       --sys-color-surface-bright: var(--ref-palette-neutral24);
-      --sys-color-surface-dim: var(--ref-palette-neutral10); /* 6! */
-      --sys-color-surface-container-lowest: var(--ref-palette-neutral0); /* 4! */
+      --sys-color-surface-dim: var(--ref-palette-neutral6); /* 6! */
+      --sys-color-surface-container-lowest: var(--ref-palette-neutral4); /* 4! */
       --sys-color-surface-container-low: var(--ref-palette-neutral10);
-      --sys-color-surface-container: var(--ref-palette-neutral10); /* 12! */
-      --sys-color-surface-container-high: var(--ref-palette-neutral20); /* 17! */
-      --sys-color-surface-container-highest: var(--ref-palette-neutral20); /* 22! */
+      --sys-color-surface-container: var(--ref-palette-neutral12); /* 12! */
+      --sys-color-surface-container-high: var(--ref-palette-neutral17); /* 17! */
+      --sys-color-surface-container-highest: var(--ref-palette-neutral22); /* 22! */
       --sys-color-surface-variant: var(--ref-palette-neutral-variant30);
       --sys-color-inverse-surface: var(--ref-palette-neutral90);