mtrl 0.10.4 → 0.10.6

package/src/styles/themes/_fruit-salad.scss

@@ -106,3 +106,153 @@
         --#{$prefix}-sys-color-inverse-primary: #00639c;
     }
 }
+
+// contrast roles: generated, do not edit
+@include create-theme-contrast("fruit-salad", (
+    medium: (
+        light: (
+            error: #740006,
+            error-container: #cf2c27,
+            on-error-container: #ffffff,
+            primary: #00395d,
+            primary-container: #1072b1,
+            on-primary-container: #ffffff,
+            secondary: #00395d,
+            secondary-container: #40719c,
+            on-secondary-container: #ffffff,
+            tertiary: #3c2d63,
+            tertiary-container: #74649f,
+            on-tertiary-container: #ffffff,
+            primary-fixed: #1072b1,
+            primary-fixed-dim: #00598d,
+            on-primary-fixed: #ffffff,
+            on-primary-fixed-variant: #ffffff,
+            secondary-fixed: #40719c,
+            secondary-fixed-dim: #245882,
+            on-secondary-fixed: #ffffff,
+            on-secondary-fixed-variant: #ffffff,
+            tertiary-fixed: #74649f,
+            tertiary-fixed-dim: #5b4c84,
+            on-tertiary-fixed: #ffffff,
+            on-tertiary-fixed-variant: #ffffff,
+            surface-dim: #cbc4d2,
+            surface-container: #ede5f4,
+            surface-container-high: #e1dae9,
+            surface-container-highest: #d6cfdd,
+            on-surface: #12101a,
+            on-surface-variant: #393347,
+            outline: #564f64,
+            outline-variant: #716a80,
+        ),
+        dark: (
+            error: #ffd2cc,
+            on-error: #540003,
+            error-container: #ff5449,
+            on-error-container: #000000,
+            primary: #c3dfff,
+            on-primary: #002843,
+            primary-container: #4796d7,
+            on-primary-container: #000000,
+            secondary: #c3dfff,
+            on-secondary: #002843,
+            secondary-container: #6695c2,
+            on-secondary-container: #000000,
+            tertiary: #e3d6ff,
+            on-tertiary: #2b1b52,
+            tertiary-container: #9887c5,
+            on-tertiary-container: #000000,
+            on-primary-fixed: #001223,
+            on-primary-fixed-variant: #00395d,
+            on-secondary-fixed: #001223,
+            on-secondary-fixed-variant: #00395d,
+            on-tertiary-fixed: #16033d,
+            on-tertiary-fixed-variant: #3c2d63,
+            surface-bright: #47434e,
+            surface-container-lowest: #08060f,
+            surface-container-low: #1f1c26,
+            surface-container: #292631,
+            surface-container-high: #34313c,
+            surface-container-highest: #403c47,
+            on-surface: #ffffff,
+            on-surface-variant: #e2d8f2,
+            outline: #b7aec6,
+            outline-variant: #948da4,
+            inverse-on-surface: #2c2833,
+            inverse-primary: #004b79,
+        ),
+    ),
+    high: (
+        light: (
+            error: #600004,
+            error-container: #98000a,
+            on-error-container: #ffffff,
+            primary: #002e4d,
+            primary-container: #004d7a,
+            on-primary-container: #ffffff,
+            secondary: #002e4d,
+            secondary-container: #144c76,
+            on-secondary-container: #ffffff,
+            tertiary: #312259,
+            tertiary-container: #4f4078,
+            on-tertiary-container: #ffffff,
+            primary-fixed: #004d7a,
+            primary-fixed-dim: #003557,
+            on-primary-fixed: #ffffff,
+            on-primary-fixed-variant: #ffffff,
+            secondary-fixed: #144c76,
+            secondary-fixed-dim: #003557,
+            on-secondary-fixed: #ffffff,
+            on-secondary-fixed-variant: #ffffff,
+            tertiary-fixed: #4f4078,
+            tertiary-fixed-dim: #382960,
+            on-tertiary-fixed: #ffffff,
+            on-tertiary-fixed-variant: #ffffff,
+            surface-dim: #bdb6c4,
+            surface-container-low: #f5eefd,
+            surface-container: #e7e0ef,
+            surface-container-high: #d9d2e0,
+            surface-container-highest: #cbc4d2,
+            on-surface: #000000,
+            on-surface-variant: #000000,
+            outline: #2f293c,
+            outline-variant: #4c465b,
+            inverse-on-surface: #ffffff,
+        ),
+        dark: (
+            error: #ffece9,
+            on-error: #000000,
+            error-container: #ffaea4,
+            on-error-container: #220001,
+            primary: #e7f1ff,
+            on-primary: #000000,
+            primary-container: #8fc8ff,
+            on-primary-container: #000c19,
+            secondary: #e7f1ff,
+            on-secondary: #000000,
+            secondary-container: #98c7f7,
+            on-secondary-container: #000c19,
+            tertiary: #f5edff,
+            on-tertiary: #000000,
+            tertiary-container: #cbb9fa,
+            on-tertiary-container: #0f0033,
+            on-primary-fixed: #000000,
+            on-primary-fixed-variant: #001223,
+            on-secondary-fixed: #000000,
+            on-secondary-fixed-variant: #001223,
+            on-tertiary-fixed: #000000,
+            on-tertiary-fixed-variant: #16033d,
+            surface-bright: #524e5a,
+            surface-container-lowest: #000000,
+            surface-container-low: #211e28,
+            surface-container: #322f3a,
+            surface-container-high: #3d3a45,
+            surface-container-highest: #494551,
+            on-surface: #ffffff,
+            on-surface-variant: #ffffff,
+            outline: #f5edff,
+            outline-variant: #c8bfd8,
+            inverse-on-surface: #000000,
+            inverse-primary: #004b79,
+        ),
+    ),
+));

package/src/styles/themes/_highcontrast.scss

@@ -106,3 +106,77 @@
         --#{$prefix}-sys-color-inverse-primary: #4e3f77;
     }
 }
+
+// contrast roles: generated, do not edit
+@include create-theme-contrast("highcontrast", (
+    medium: (
+        light: (
+            error: #740006,
+            error-container: #cf2c27,
+            primary: #3c2d63,
+            primary-container: #74649f,
+            secondary: #393347,
+            secondary-container: #716a80,
+            tertiary: #502b38,
+            tertiary-container: #8e606f,
+            primary-fixed: #74649f,
+            primary-fixed-dim: #5b4c84,
+            secondary-fixed: #716a80,
+            secondary-fixed-dim: #585267,
+            tertiary-fixed: #8e606f,
+            tertiary-fixed-dim: #734856,
+            surface-dim: #cac5cc,
+            surface-container-low: #f8f2fa,
+            surface-container: #ece6ee,
+            surface-container-high: #e1dbe3,
+            surface-container-highest: #d5d0d8,
+            on-surface: #121016,
+            on-surface-variant: #38353d,
+            outline: #54515a,
+            outline-variant: #6f6b75,
+            inverse-on-surface: #f5eff7,
+        ),
+        dark: (
+            error: #ffd2cc,
+            on-error: #540003,
+            error-container: #ff5449,
+            on-error-container: #000000,
+            primary: #e3d6ff,
+            on-primary: #2b1b52,
+            primary-container: #9887c5,
+            on-primary-container: #000000,
+            secondary: #e2d8f2,
+            on-secondary: #282336,
+            secondary-container: #958da4,
+            on-secondary-container: #000000,
+            tertiary: #ffd0dd,
+            on-tertiary: #3d1a27,
+            tertiary-container: #b58392,
+            on-tertiary-container: #000000,
+            on-primary-fixed: #16033d,
+            on-primary-fixed-variant: #3c2d63,
+            on-secondary-fixed: #130e20,
+            on-secondary-fixed-variant: #393347,
+            on-tertiary-fixed: #240613,
+            on-tertiary-fixed-variant: #502b38,
+            surface-bright: #46434a,
+            surface-container-lowest: #08070b,
+            surface-container-low: #1f1d22,
+            surface-container: #29272d,
+            surface-container-high: #343138,
+            surface-container-highest: #3f3c43,
+            on-surface-variant: #e0dae5,
+            outline: #b5b0bb,
+            outline-variant: #938e99,
+            inverse-on-surface: #2b292f,
+        ),
+    ),
+    high: (
+        light: (
+
+        ),
+        dark: (
+
+        ),
+    ),
+));

package/src/styles/themes/_legacy.scss

@@ -1,4 +1,5 @@
 // src/styles/themes/_legacy.scss
+// Medium/high contrast: Tonal Spot from seed #00489a, secondary from #ea9d97, tertiary from #ff3400.
 // Deprecated in 0.10, removed in 1.0 (FLO-308): no replacement in mtrl: Radiooooo v4 ships its own palette.
 // Legacy: the Radiooooo v3 palette. Values are the v3 ones, set by hand:
 // bar blue on primary, selection orange on tertiary, the salmon selected-mode
@@ -80,3 +81,183 @@
         @include status-colors-dark();
     }
 }
+
+// contrast roles: generated, do not edit
+@include create-theme-contrast("legacy", (
+    medium: (
+        light: (
+            error: #740006,
+            error-container: #cf2c27,
+            on-error-container: #ffffff,
+            primary: #173566,
+            primary-container: #526da1,
+            on-primary-container: #ffffff,
+            secondary: #5a2623,
+            secondary-container: #9c5b57,
+            on-secondary-container: #ffffff,
+            tertiary: #6e1100,
+            tertiary-container: #d22900,
+            on-tertiary-container: #ffffff,
+            primary-fixed: #526da1,
+            primary-fixed-dim: #395487,
+            on-primary-fixed: #ffffff,
+            on-primary-fixed-variant: #ffffff,
+            secondary-fixed: #9c5b57,
+            secondary-fixed-dim: #7f4440,
+            on-secondary-fixed: #ffffff,
+            on-secondary-fixed-variant: #ffffff,
+            tertiary-fixed: #d22900,
+            tertiary-fixed-dim: #a61e00,
+            on-tertiary-fixed: #ffffff,
+            on-tertiary-fixed-variant: #ffffff,
+            surface: #f9f9ff,
+            surface-dim: #c6c6cd,
+            surface-bright: #f9f9ff,
+            surface-variant: #e1e2ec,
+            surface-container-low: #f3f3fa,
+            surface-container: #e8e7ee,
+            surface-container-high: #dcdce3,
+            surface-container-highest: #d1d1d8,
+            on-surface: #0f1116,
+            on-surface-variant: #33363e,
+            outline: #50525a,
+            outline-variant: #6a6d75,
+            inverse-surface: #2f3036,
+            inverse-on-surface: #f0f0f7,
+        ),
+        dark: (
+            error: #ffd2cc,
+            on-error: #540003,
+            error-container: #ff5449,
+            on-error-container: #000000,
+            primary: #cedcff,
+            on-primary: #002454,
+            primary-container: #7691c7,
+            on-primary-container: #000000,
+            secondary: #ffd2ce,
+            on-secondary: #451614,
+            secondary-container: #c57e78,
+            on-secondary-container: #000000,
+            tertiary: #ffd2c9,
+            on-tertiary: #500900,
+            tertiary-container: #ff5632,
+            on-tertiary-container: #000000,
+            primary-fixed: #d8e2ff,
+            primary-fixed-dim: #acc7ff,
+            on-primary-fixed: #00102d,
+            on-primary-fixed-variant: #173566,
+            secondary-fixed: #ffdad7,
+            secondary-fixed-dim: #ffb3ad,
+            on-secondary-fixed: #2a0304,
+            on-secondary-fixed-variant: #5a2623,
+            tertiary-fixed: #ffdad3,
+            tertiary-fixed-dim: #ffb4a4,
+            on-tertiary-fixed: #2a0300,
+            on-tertiary-fixed-variant: #6e1100,
+            surface: #111318,
+            surface-dim: #111318,
+            surface-bright: #43444a,
+            surface-variant: #44474f,
+            surface-container-lowest: #06070c,
+            surface-container-low: #1c1d22,
+            surface-container: #26282d,
+            surface-container-high: #313238,
+            surface-container-highest: #3c3d43,
+            on-surface: #ffffff,
+            on-surface-variant: #dadce6,
+            outline: #b0b1bb,
+            outline-variant: #8e9099,
+            inverse-surface: #e2e2e9,
+            inverse-on-surface: #282a2f,
+            inverse-primary: #2c4779,
+        ),
+    ),
+    high: (
+        light: (
+            error: #600004,
+            error-container: #98000a,
+            on-error-container: #ffffff,
+            primary: #082b5b,
+            primary-container: #2d497a,
+            on-primary-container: #ffffff,
+            secondary: #4e1c1a,
+            secondary-container: #713835,
+            on-secondary-container: #ffffff,
+            tertiary: #5c0c00,
+            tertiary-container: #901900,
+            on-tertiary-container: #ffffff,
+            primary-fixed: #2d497a,
+            primary-fixed-dim: #123262,
+            on-primary-fixed: #ffffff,
+            on-primary-fixed-variant: #ffffff,
+            secondary-fixed: #713835,
+            secondary-fixed-dim: #562320,
+            on-secondary-fixed: #ffffff,
+            on-secondary-fixed-variant: #ffffff,
+            tertiary-fixed: #901900,
+            tertiary-fixed-dim: #670f00,
+            on-tertiary-fixed: #ffffff,
+            on-tertiary-fixed-variant: #ffffff,
+            surface: #f9f9ff,
+            surface-dim: #b8b8bf,
+            surface-bright: #f9f9ff,
+            surface-variant: #e1e2ec,
+            surface-container-low: #f0f0f7,
+            surface-container: #e2e2e9,
+            surface-container-high: #d4d4db,
+            surface-container-highest: #c6c6cd,
+            on-surface: #000000,
+            on-surface-variant: #000000,
+            outline: #292c33,
+            outline-variant: #464951,
+            inverse-surface: #2f3036,
+            inverse-on-surface: #ffffff,
+        ),
+        dark: (
+            error: #ffece9,
+            on-error: #000000,
+            error-container: #ffaea4,
+            on-error-container: #220001,
+            primary: #ecefff,
+            on-primary: #000000,
+            primary-container: #a8c3fc,
+            on-primary-container: #000a22,
+            secondary: #ffecea,
+            on-secondary: #000000,
+            secondary-container: #feaea8,
+            on-secondary-container: #210001,
+            tertiary: #ffece8,
+            on-tertiary: #000000,
+            tertiary-container: #ffaf9d,
+            on-tertiary-container: #200200,
+            primary-fixed: #d8e2ff,
+            primary-fixed-dim: #acc7ff,
+            on-primary-fixed: #000000,
+            on-primary-fixed-variant: #00102d,
+            secondary-fixed: #ffdad7,
+            secondary-fixed-dim: #ffb3ad,
+            on-secondary-fixed: #000000,
+            on-secondary-fixed-variant: #2a0304,
+            tertiary-fixed: #ffdad3,
+            tertiary-fixed-dim: #ffb4a4,
+            on-tertiary-fixed: #000000,
+            on-tertiary-fixed-variant: #2a0300,
+            surface: #111318,
+            surface-dim: #111318,
+            surface-bright: #4e5056,
+            surface-variant: #44474f,
+            surface-container-lowest: #000000,
+            surface-container-low: #1e2025,
+            surface-container: #2f3036,
+            surface-container-high: #3a3b41,
+            surface-container-highest: #45474c,
+            on-surface: #ffffff,
+            on-surface-variant: #ffffff,
+            outline: #eeeff9,
+            outline-variant: #c0c2cc,
+            inverse-surface: #e2e2e9,
+            inverse-on-surface: #000000,
+            inverse-primary: #2c4779,
+        ),
+    ),
+));

package/src/styles/themes/_material.scss

@@ -1,4 +1,5 @@
 // src/styles/themes/_material.scss
+// Medium/high contrast: Tonal Spot from seed #6750a4, secondary from #5d5d74, tertiary from #7d5260.
 // Deprecated in 0.10, removed in 1.0 (FLO-308): use `baseline`, M3's own baseline (this one doesn't match it).
 @use "../abstract/base" as *;
 @use "base-theme" as *;
@@ -88,3 +89,183 @@
         @include status-colors-dark();
     }
 }
+
+// contrast roles: generated, do not edit
+@include create-theme-contrast("material", (
+    medium: (
+        light: (
+            error: #740006,
+            error-container: #cf2c27,
+            on-error-container: #ffffff,
+            primary: #3c2d63,
+            primary-container: #74649f,
+            on-primary-container: #ffffff,
+            secondary: #343449,
+            secondary-container: #6b6b83,
+            on-secondary-container: #ffffff,
+            tertiary: #502b38,
+            tertiary-container: #8d606f,
+            on-tertiary-container: #ffffff,
+            primary-fixed: #74649f,
+            primary-fixed-dim: #5b4c84,
+            on-primary-fixed: #ffffff,
+            on-primary-fixed-variant: #ffffff,
+            secondary-fixed: #6b6b83,
+            secondary-fixed-dim: #535369,
+            on-secondary-fixed: #ffffff,
+            on-secondary-fixed-variant: #ffffff,
+            tertiary-fixed: #8d606f,
+            tertiary-fixed-dim: #724956,
+            on-tertiary-fixed: #ffffff,
+            on-tertiary-fixed-variant: #ffffff,
+            surface: #fdf7ff,
+            surface-dim: #cac5cc,
+            surface-bright: #fdf7ff,
+            surface-variant: #e7e0eb,
+            surface-container-low: #f8f2fa,
+            surface-container: #ece6ee,
+            surface-container-high: #e1dbe3,
+            surface-container-highest: #d5d0d8,
+            on-surface: #121016,
+            on-surface-variant: #38353d,
+            outline: #54515a,
+            outline-variant: #6f6b75,
+            inverse-surface: #322f35,
+            inverse-on-surface: #f5eff7,
+            inverse-primary: #cfbdfe,
+        ),
+        dark: (
+            error: #ffd2cc,
+            on-error: #540003,
+            error-container: #ff5449,
+            on-error-container: #000000,
+            primary: #e3d6ff,
+            on-primary: #2b1b52,
+            primary-container: #9887c5,
+            on-primary-container: #000000,
+            secondary: #dbdaf5,
+            on-secondary: #232438,
+            secondary-container: #8f8ea7,
+            on-secondary-container: #000000,
+            tertiary: #ffd0dd,
+            on-tertiary: #3d1b27,
+            tertiary-container: #b48392,
+            on-tertiary-container: #000000,
+            primary-fixed: #e9ddff,
+            primary-fixed-dim: #cfbdfe,
+            on-primary-fixed: #16033d,
+            on-primary-fixed-variant: #3c2d63,
+            secondary-fixed: #e2e0fb,
+            secondary-fixed-dim: #c5c4df,
+            on-secondary-fixed: #0f0f22,
+            on-secondary-fixed-variant: #343449,
+            tertiary-fixed: #ffd9e3,
+            tertiary-fixed-dim: #eeb8c8,
+            on-tertiary-fixed: #240713,
+            on-tertiary-fixed-variant: #502b38,
+            surface: #141218,
+            surface-bright: #46434a,
+            surface-variant: #49454e,
+            surface-container-lowest: #08070b,
+            surface-container-low: #1f1d22,
+            surface-container: #29272d,
+            surface-container-high: #343138,
+            surface-container-highest: #3f3c43,
+            on-surface: #ffffff,
+            on-surface-variant: #e0dae5,
+            outline: #b5b0bb,
+            outline-variant: #938e99,
+            inverse-surface: #e6e0e9,
+            inverse-on-surface: #2b292f,
+            inverse-primary: #4e3f77,
+        ),
+    ),
+    high: (
+        light: (
+            error: #600004,
+            error-container: #98000a,
+            on-error-container: #ffffff,
+            primary: #312259,
+            primary-container: #4f4078,
+            on-primary-container: #ffffff,
+            secondary: #2a2a3f,
+            secondary-container: #47475d,
+            on-secondary-container: #ffffff,
+            tertiary: #44212e,
+            tertiary-container: #653d4b,
+            on-tertiary-container: #ffffff,
+            primary-fixed: #4f4078,
+            primary-fixed-dim: #382960,
+            on-primary-fixed: #ffffff,
+            on-primary-fixed-variant: #ffffff,
+            secondary-fixed: #47475d,
+            secondary-fixed-dim: #303146,
+            on-secondary-fixed: #ffffff,
+            on-secondary-fixed-variant: #ffffff,
+            tertiary-fixed: #653d4b,
+            tertiary-fixed-dim: #4c2734,
+            on-tertiary-fixed: #ffffff,
+            on-tertiary-fixed-variant: #ffffff,
+            surface: #fdf7ff,
+            surface-dim: #bcb7bf,
+            surface-bright: #fdf7ff,
+            surface-variant: #e7e0eb,
+            surface-container-low: #f5eff7,
+            surface-container: #e6e0e9,
+            surface-container-high: #d8d2da,
+            surface-container-highest: #cac5cc,
+            on-surface: #000000,
+            on-surface-variant: #000000,
+            outline: #2e2b33,
+            outline-variant: #4b4851,
+            inverse-surface: #322f35,
+            inverse-on-surface: #ffffff,
+            inverse-primary: #cfbdfe,
+        ),
+        dark: (
+            error: #ffece9,
+            on-error: #000000,
+            error-container: #ffaea4,
+            on-error-container: #220001,
+            primary: #f5edff,
+            on-primary: #000000,
+            primary-container: #cbb9fa,
+            on-primary-container: #0f0033,
+            secondary: #f1eeff,
+            on-secondary: #000000,
+            secondary-container: #c1c0db,
+            on-secondary-container: #09091c,
+            tertiary: #ffebef,
+            on-tertiary: #000000,
+            tertiary-container: #eab4c4,
+            on-tertiary-container: #1d030d,
+            primary-fixed: #e9ddff,
+            primary-fixed-dim: #cfbdfe,
+            on-primary-fixed: #000000,
+            on-primary-fixed-variant: #16033d,
+            secondary-fixed: #e2e0fb,
+            secondary-fixed-dim: #c5c4df,
+            on-secondary-fixed: #000000,
+            on-secondary-fixed-variant: #0f0f22,
+            tertiary-fixed: #ffd9e3,
+            tertiary-fixed-dim: #eeb8c8,
+            on-tertiary-fixed: #000000,
+            on-tertiary-fixed-variant: #240713,
+            surface: #141218,
+            surface-bright: #524f55,
+            surface-variant: #49454e,
+            surface-container-lowest: #000000,
+            surface-container-low: #211f24,
+            surface-container: #322f35,
+            surface-container-high: #3d3a41,
+            surface-container-highest: #48464c,
+            on-surface: #ffffff,
+            on-surface-variant: #ffffff,
+            outline: #f4eef9,
+            outline-variant: #c6c0cb,
+            inverse-surface: #e6e0e9,
+            inverse-on-surface: #000000,
+            inverse-primary: #4e3f77,
+        ),
+    ),
+));