feat: readded overlay inverse back in js tokens

MetaMask · May 30, 2024 · e50c5dc · e50c5dc
1 parent 3cbaae3
commit e50c5dc
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 1 deletion.
diff --git a/MIGRATION.md b/MIGRATION.md
@@ -34,7 +34,6 @@ brandColor.black000 modified to brandColor.black
 #### JS Tokens
 
 ```
-colors.overlay.inverse removed
 colors.primary.shadow modified to colors.shadow.primary
 colors.primary.disabled removed
 colors.secondary.default removed

diff --git a/src/js/themes/darkTheme/colors.ts b/src/js/themes/darkTheme/colors.ts
@@ -29,6 +29,7 @@ export const colors: ThemeColors = {
   overlay: {
     default: '#00000099', // For the default shade of screen
     alternative: '#000000cc', // For a stronger shade of screen
+    inverse: brandColor.grey000, // For elements used on top of overlay/alternative. Used for text, icon or border
   },
   primary: {
     default: brandColor.blue300, // For interactive, active, and selected semantics. Used for text, background, icon or border

diff --git a/src/js/themes/lightTheme/colors.ts b/src/js/themes/lightTheme/colors.ts
@@ -29,6 +29,7 @@ export const colors: ThemeColors = {
   overlay: {
     default: '#00000099', // For the default shade of screen
     alternative: '#000000cc', // For a stronger shade of screen
+    inverse: brandColor.grey000, // For elements used on top of overlay/alternative. Used for text, icon or border
   },
   primary: {
     default: brandColor.blue500, // For interactive, active, and selected semantics. Used for text, background, icon or border

diff --git a/src/js/themes/types.ts b/src/js/themes/types.ts
@@ -103,6 +103,10 @@ export type ThemeColors = {
      * {string} overlay.alternative - For a stronger shade of screen
      */
     alternative: string;
+    /**
+     * {string} overlay.inverse - For elements used on top of overlay/alternative. Used for text, icon or border
+     */
+    inverse: string;
   };
   shadow: {
     /**