Merge branch 'FW-6252' into FW-6252-button

Author: brandyscarney

core/src/css/palettes/dark.scss

@@ -17,54 +17,63 @@ $colors: (
     contrast: #000,
     shade: get-color-shade($primary),
     tint: get-color-tint($primary),
+    foreground: $primary,
   ),
   secondary: (
     base: $secondary,
     contrast: #000,
     shade: get-color-shade($secondary),
     tint: get-color-tint($secondary),
+    foreground: $secondary,
   ),
   tertiary: (
     base: $tertiary,
     contrast: #000,
     shade: get-color-shade($tertiary),
     tint: get-color-tint($tertiary),
+    foreground: $tertiary,
   ),
   success: (
     base: $success,
     contrast: #000,
     shade: get-color-shade($success),
     tint: get-color-tint($success),
+    foreground: $success,
   ),
   warning: (
     base: $warning,
     contrast: #000,
     shade: get-color-shade($warning),
     tint: get-color-tint($warning),
+    foreground: $warning,
   ),
   danger: (
     base: $danger,
     contrast: #000,
     shade: get-color-shade($danger),
     tint: get-color-tint($danger),
+    foreground: $danger,
   ),
   light: (
     base: $light,
     contrast: #fff,
     shade: get-color-shade($light),
     tint: get-color-tint($light),
+    foreground: $light,
   ),
   medium: (
     base: $medium,
     contrast: #000,
     shade: get-color-shade($medium),
     tint: get-color-tint($medium),
+    foreground: $medium,
   ),
   dark: (
     base: $dark,
     contrast: #000,
     shade: get-color-shade($dark),
     tint: get-color-tint($dark),
+    foreground: $dark,
   ),
 );
 
@@ -77,6 +86,7 @@ $colors: (
       --ion-color-#{$color-name}-contrast-rgb: #{color-to-rgb-list(map.get($value, contrast))};
       --ion-color-#{$color-name}-shade: #{map.get($value, shade)};
       --ion-color-#{$color-name}-tint: #{map.get($value, tint)};
+      --ion-color-#{$color-name}-foreground: #{map.get($value, foreground)};
     }
   }
 }

core/src/css/palettes/high-contrast-dark.scss

@@ -17,54 +17,63 @@ $colors: (
     contrast: #000,
     shade: get-color-shade($primary),
     tint: get-color-tint($primary),
+    foreground: $primary,
   ),
   secondary: (
     base: $secondary,
     contrast: #000,
     shade: get-color-shade($secondary),
     tint: get-color-tint($secondary),
+    foreground: $secondary,
   ),
   tertiary: (
     base: $tertiary,
     contrast: #000,
     shade: get-color-shade($tertiary),
     tint: get-color-tint($tertiary),
+    foreground: $tertiary,
   ),
   success: (
     base: $success,
     contrast: #000,
     shade: get-color-shade($success),
     tint: get-color-tint($success),
+    foreground: $success,
   ),
   warning: (
     base: $warning,
     contrast: #000,
     shade: get-color-shade($warning),
     tint: get-color-tint($warning),
+    foreground: $warning,
   ),
   danger: (
     base: $danger,
     contrast: #000,
     shade: get-color-shade($danger),
     tint: get-color-tint($danger),
+    foreground: $danger,
   ),
   light: (
     base: $light,
     contrast: #fff,
     shade: get-color-shade($light),
     tint: get-color-tint($light),
+    foreground: $light,
   ),
   medium: (
     base: $medium,
     contrast: #000,
     shade: get-color-shade($medium),
     tint: get-color-tint($medium),
+    foreground: $medium,
   ),
   dark: (
     base: $dark,
     contrast: #000,
     shade: get-color-shade($dark),
     tint: get-color-tint($dark),
+    foreground: $dark,
   ),
 );
 
@@ -104,6 +113,7 @@ $lightest-text-color: $text-color;
       --ion-color-#{$color-name}-contrast-rgb: #{color-to-rgb-list(map.get($value, contrast))};
       --ion-color-#{$color-name}-shade: #{map.get($value, shade)};
       --ion-color-#{$color-name}-tint: #{map.get($value, tint)};
+      --ion-color-#{$color-name}-foreground: #{map.get($value, foreground)};
     }
   }
 }

core/src/css/palettes/high-contrast.scss

@@ -17,54 +17,63 @@ $colors: (
     contrast: #fff,
     shade: get-color-shade($primary),
     tint: get-color-tint($primary),
+    foreground: $primary,
   ),
   secondary: (
     base: $secondary,
     contrast: #fff,
     shade: get-color-shade($secondary),
     tint: get-color-tint($secondary),
+    foreground: $secondary,
   ),
   tertiary: (
     base: $tertiary,
     contrast: #fff,
     shade: get-color-shade($tertiary),
     tint: get-color-tint($tertiary),
+    foreground: $tertiary,
   ),
   success: (
     base: $success,
     contrast: #fff,
     shade: get-color-shade($success),
     tint: get-color-tint($success),
+    foreground: $success,
   ),
   warning: (
     base: $warning,
     contrast: #fff,
     shade: get-color-shade($warning),
     tint: get-color-tint($warning),
+    foreground: $warning,
   ),
   danger: (
     base: $danger,
     contrast: #fff,
     shade: get-color-shade($danger),
     tint: get-color-tint($danger),
+    foreground: $danger,
   ),
   light: (
     base: $light,
     contrast: #000,
     shade: get-color-shade($light),
     tint: get-color-tint($light),
+    foreground: $light,
   ),
   medium: (
     base: $medium,
     contrast: #fff,
     shade: get-color-shade($medium),
     tint: get-color-tint($medium),
+    foreground: $medium,
   ),
   dark: (
     base: $dark,
     contrast: #fff,
     shade: get-color-shade($dark),
     tint: get-color-tint($dark),
+    foreground: $dark,
   ),
 );
 
@@ -127,6 +136,7 @@ $lightest-text-color: #888888;
       --ion-color-#{$color-name}-contrast-rgb: #{color-to-rgb-list(map.get($value, contrast))};
       --ion-color-#{$color-name}-shade: #{map.get($value, shade)};
       --ion-color-#{$color-name}-tint: #{map.get($value, tint)};
+      --ion-color-#{$color-name}-foreground: #{map.get($value, foreground)};
     }
   }
 }