Skip to content

Commit

Permalink
feat(suite): updated color names to palette mapping
Browse files Browse the repository at this point in the history
  • Loading branch information
@vytick
vytick committed Apr 19, 2024
1 parent c97928c commit 32b0835
Showing 1 changed file with 29 additions and 11 deletions.
40 changes: 29 additions & 11 deletions packages/theme/src/colors.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,18 +37,21 @@ const light = {

// Figma Colors
backgroundAlertBlueBold: palette.lightAccentBlue600,
backgroundAlertBlueBoldAlt: palette.lightAccentBlue700,
backgroundAlertBlueSubtleOnElevation0: palette.lightAccentBlue300,
backgroundAlertBlueSubtleOnElevation1: palette.lightAccentBlue200,
backgroundAlertBlueSubtleOnElevation2: palette.lightAccentBlue100,
backgroundAlertBlueSubtleOnElevation3: palette.lightAccentBlue50,
backgroundAlertBlueSubtleOnElevationNegative: palette.lightAccentBlue400,
backgroundAlertRedBold: palette.lightAccentRed600,
backgroundAlertRedBoldAlt: palette.lightAccentRed700,
backgroundAlertRedSubtleOnElevation0: palette.lightAccentRed300,
backgroundAlertRedSubtleOnElevation1: palette.lightAccentRed200,
backgroundAlertRedSubtleOnElevation2: palette.lightAccentRed100,
backgroundAlertRedSubtleOnElevation3: palette.lightAccentRed50,
backgroundAlertRedSubtleOnElevationNegative: palette.lightAccentRed400,
backgroundAlertYellowBold: palette.lightAccentYellow600,
backgroundAlertYellowBoldAlt: palette.lightAccentYellow700,
backgroundAlertYellowSubtleOnElevation0: palette.lightAccentYellow300,
backgroundAlertYellowSubtleOnElevation1: palette.lightAccentYellow200,
backgroundAlertYellowSubtleOnElevation2: palette.lightAccentYellow100,
Expand Down Expand Up @@ -87,18 +90,21 @@ const light = {
borderElevation1: palette.lightGray200,
borderElevation2: palette.lightGray200,
borderElevation3: palette.lightGray200,
borderElevationNegative: palette.lightGray300,
borderElevationNegative: palette.lightGray400,
borderSecondary: palette.lightSecondaryEmerald800,
borderSubtleInverted: palette.lightWhiteAlpha400,
iconAlertBlue: palette.lightAccentBlue700,
iconAlertBlue: palette.lightAccentBlue800,
iconAlertRed: palette.lightAccentRed700,
iconAlertYellow: palette.lightAccentYellow700,
iconAlertYellow: palette.lightAccentYellow800,
iconDefault: palette.lightGray1000,
iconDefaultInverted: palette.lightWhiteAlpha1000,
iconDisabled: palette.lightGray600,
iconOnBlue: palette.lightWhiteAlpha1000,
iconOnPrimary: palette.lightWhiteAlpha1000,
iconOnRed: palette.lightWhiteAlpha1000,
iconOnSecondary: palette.lightWhiteAlpha1000,
iconOnTertiary: palette.lightGray800,
iconOnYellow: palette.lightGray1000,
iconPrimaryDefault: palette.lightPrimaryForest800,
iconPrimaryPressed: palette.lightPrimaryForest900,
iconSubdued: palette.lightGray700,
Expand Down Expand Up @@ -142,15 +148,18 @@ const light = {
interactionBackgroundWarningDefaultNormalOnElevation2: palette.lightAccentYellow200,
interactionBackgroundWarningDefaultNormalOnElevation3: palette.lightAccentYellow100,
interactionBackgroundWarningDefaultNormalOnElevationNegative: palette.lightAccentYellow300,
textAlertBlue: palette.lightAccentBlue700,
textAlertBlue: palette.lightAccentBlue800,
textAlertRed: palette.lightAccentRed700,
textAlertYellow: palette.lightAccentYellow700,
textAlertYellow: palette.lightAccentYellow800,
textDefault: palette.lightGray1000,
textDefaultInverted: palette.lightWhiteAlpha1000,
textDisabled: palette.lightGray600,
textOnBlue: palette.lightWhiteAlpha1000,
textOnPrimary: palette.lightWhiteAlpha1000,
textOnRed: palette.lightWhiteAlpha1000,
textOnSecondary: palette.lightWhiteAlpha1000,
textOnTertiary: palette.lightGray800,
textOnYellow: palette.lightGray1000,
textPrimaryDefault: palette.lightPrimaryForest800,
textPrimaryPressed: palette.lightPrimaryForest900,
textSecondaryHighlight: palette.lightSecondaryEmerald800,
Expand Down Expand Up @@ -190,18 +199,21 @@ export const colorVariants: Record<ThemeColorVariant, Colors> = {

// Figma Colors
backgroundAlertBlueBold: palette.darkAccentBlue600,
backgroundAlertBlueBoldAlt: palette.darkAccentBlue700,
backgroundAlertBlueSubtleOnElevation0: palette.darkAccentBlue50,
backgroundAlertBlueSubtleOnElevation1: palette.darkAccentBlue100,
backgroundAlertBlueSubtleOnElevation2: palette.darkAccentBlue200,
backgroundAlertBlueSubtleOnElevation3: palette.darkAccentBlue300,
backgroundAlertBlueSubtleOnElevationNegative: '#FFFFFF',
backgroundAlertRedBold: palette.darkAccentRed600,
backgroundAlertRedBoldAlt: palette.darkAccentRed700,
backgroundAlertRedSubtleOnElevation0: palette.darkAccentRed50,
backgroundAlertRedSubtleOnElevation1: palette.darkAccentRed100,
backgroundAlertRedSubtleOnElevation2: palette.darkAccentRed200,
backgroundAlertRedSubtleOnElevation3: palette.darkAccentRed300,
backgroundAlertRedSubtleOnElevationNegative: '#FFFFFF',
backgroundAlertYellowBold: palette.darkAccentYellow600,
backgroundAlertYellowBoldAlt: palette.darkAccentYellow700,
backgroundAlertYellowSubtleOnElevation0: palette.darkAccentYellow50,
backgroundAlertYellowSubtleOnElevation1: palette.darkAccentYellow100,
backgroundAlertYellowSubtleOnElevation2: palette.darkAccentYellow200,
Expand Down Expand Up @@ -234,13 +246,13 @@ export const colorVariants: Record<ThemeColorVariant, Colors> = {
backgroundTertiaryPressedOnElevationNegative: palette.darkGray100,
borderAlertRed: palette.darkAccentRed600,
borderDashed: palette.darkGray200,
borderFocus: palette.darkGray200,
borderInverted: palette.darkGray000,
borderElevation0: palette.darkGray100,
borderElevation1: palette.darkGray200,
borderElevation2: palette.darkGray300,
borderElevation3: palette.darkGray400,
borderElevationNegative: palette.darkGray200,
borderElevationNegative: palette.darkGray50,
borderFocus: palette.darkGray200,
borderInverted: palette.darkGray000,
borderSecondary: palette.darkSecondaryGreen800,
borderSubtleInverted: '#0000007F',
iconAlertBlue: palette.darkAccentBlue700,
Expand All @@ -249,9 +261,12 @@ export const colorVariants: Record<ThemeColorVariant, Colors> = {
iconDefault: palette.darkGray1000,
iconDefaultInverted: palette.darkGray000,
iconDisabled: palette.darkGray600,
iconOnBlue: palette.darkGray1000,
iconOnPrimary: palette.darkGray000,
iconOnRed: palette.darkGray1000,
iconOnSecondary: palette.darkGray000,
iconOnTertiary: palette.darkGray800,
iconOnYellow: palette.darkGray000,
iconPrimaryDefault: palette.darkPrimaryForest800,
iconPrimaryPressed: palette.darkPrimaryForest900,
iconSubdued: palette.darkGray700,
Expand Down Expand Up @@ -295,15 +310,18 @@ export const colorVariants: Record<ThemeColorVariant, Colors> = {
interactionBackgroundWarningDefaultNormalOnElevation2: palette.darkAccentYellow300,
interactionBackgroundWarningDefaultNormalOnElevation3: palette.darkAccentYellow400,
interactionBackgroundWarningDefaultNormalOnElevationNegative: palette.darkAccentYellow50,
textAlertBlue: palette.darkAccentBlue700,
textAlertRed: palette.darkAccentRed700,
textAlertYellow: palette.darkAccentYellow600,
textAlertBlue: palette.darkAccentBlue800,
textAlertRed: palette.darkAccentRed800,
textAlertYellow: palette.darkAccentYellow700,
textDefault: palette.darkGray1000,
textDefaultInverted: palette.darkGray000,
textDisabled: palette.darkGray600,
textOnBlue: palette.darkAccentBlue800,
textOnPrimary: palette.darkGray000,
textOnRed: palette.darkGray1000,
textOnSecondary: palette.darkGray000,
textOnTertiary: palette.darkGray800,
textOnYellow: palette.darkGray000,
textPrimaryDefault: palette.darkPrimaryForest800,
textPrimaryPressed: palette.darkPrimaryForest900,
textSecondaryHighlight: palette.darkSecondaryGreen800,
Expand Down

0 comments on commit 32b0835

Please sign in to comment.