rebuild CSS + fix tests after rebase

FirefoxUX · Feb 6, 2024 · 0743247 · 0743247
1 parent c3455e2
commit 0743247
Show file tree

Hide file tree

Showing 5 changed files with 17 additions and 17 deletions.
diff --git a/toolkit/themes/shared/design-system/build/css/tokens-brand.css b/toolkit/themes/shared/design-system/build/css/tokens-brand.css
@@ -13,6 +13,6 @@
 
 :root {
   --text-color-deemphasized: light-dark(color-mix(in srgb, currentColor 69%, transparent), color-mix(in srgb, currentColor 75%, transparent));
-  --text-color-default: light-dark(var(--color-gray-100), var(--color-gray-05));
-  --border-interactive-color-default: light-dark(var(--color-gray-60), var(--color-gray-50));
+  --text-color: light-dark(var(--color-gray-100), var(--color-gray-05));
+  --border-interactive-color: light-dark(var(--color-gray-60), var(--color-gray-50));
 }
diff --git a/toolkit/themes/shared/design-system/build/css/tokens-platform.css b/toolkit/themes/shared/design-system/build/css/tokens-platform.css
@@ -12,6 +12,6 @@
 @import url("chrome://global/skin/design-system/tokens-shared.css");
 
 :root {
-  --text-color-default: currentColor;
-  --border-interactive-color-default: color-mix(in srgb, currentColor 15%, var(--color-gray-60));
+  --text-color: currentColor;
+  --border-interactive-color: color-mix(in srgb, currentColor 15%, var(--color-gray-60));
 }
diff --git a/toolkit/themes/shared/design-system/build/css/tokens-shared.css b/toolkit/themes/shared/design-system/build/css/tokens-shared.css
@@ -55,15 +55,15 @@
     --border-interactive-color-disabled: GrayText;
     --border-interactive-color-active: AccentColor;
     --border-interactive-color-hover: SelectedItem;
-    --text-color-default: CanvasText;
-    --border-interactive-color-default: AccentColor;
-    --border-color: var(--text-color-default);
+    --text-color: CanvasText;
+    --border-interactive-color: AccentColor;
+    --border-color: var(--text-color);
   }
 
   @media (forced-colors) {
     --border-interactive-color-disabled: GrayText;
     --border-interactive-color-active: ButtonText;
     --border-interactive-color-hover: ButtonText;
-    --border-interactive-color-default: ButtonText;
+    --border-interactive-color: ButtonText;
   }
 }
diff --git a/toolkit/themes/shared/design-system/config.js b/toolkit/themes/shared/design-system/config.js
@@ -59,7 +59,7 @@ const MEDIA_QUERY_PROPERTY_MAP = {
  */
 const createDesktopFormat = surface => args => {
   return (
-    customFileHeader() +
+    customFileHeader(surface) +
     ":root {\n" +
     formatTokens({
       surface,

diff --git a/toolkit/themes/shared/design-system/tests/config.test.js b/toolkit/themes/shared/design-system/tests/config.test.js
@@ -56,34 +56,34 @@ const SHARED_CSS_RULES = {
 
 const SHARED_PREFERS_CONTRAST_CSS_RULES = {
   "--text-color-deemphasized": "inherit",
-  "--text-color-default": "CanvasText",
+  "--text-color": "CanvasText",
   "--border-interactive-color-disabled": "GrayText",
   "--border-interactive-color-active": "AccentColor",
   "--border-interactive-color-hover": "SelectedItem",
-  "--border-interactive-color-default": "AccentColor",
-  "--border-color": "var(--text-color-default)",
+  "--border-interactive-color": "AccentColor",
+  "--border-color": "var(--text-color)",
 };
 
 const SHARED_FORCED_COLORS_CSS_RULES = {
   "--border-interactive-color-disabled": "GrayText",
   "--border-interactive-color-active": "ButtonText",
   "--border-interactive-color-hover": "ButtonText",
-  "--border-interactive-color-default": "ButtonText",
+  "--border-interactive-color": "ButtonText",
 };
 
 const BRAND_CSS_RULES = {
-  "--border-interactive-color-default":
+  "--border-interactive-color":
     "light-dark(var(--color-gray-60), var(--color-gray-50))",
-  "--text-color-default":
+  "--text-color":
     "light-dark(var(--color-gray-100), var(--color-gray-05))",
   "--text-color-deemphasized":
     "light-dark(color-mix(in srgb, currentColor 69%, transparent), color-mix(in srgb, currentColor 75%, transparent))",
 };
 
 const PLATFORM_CSS_RULES = {
-  "--border-interactive-color-default":
+  "--border-interactive-color":
     "color-mix(in srgb, currentColor 15%, var(--color-gray-60))",
-  "--text-color-default": "currentColor",
+  "--text-color": "currentColor",
 };
 
 const SHARED_FIXTURE_BY_QUERY = {