Web:Components:Utils Color name changed

packages/components/themes/base.js

@@ -18,11 +18,10 @@ const {
   blueDisabled,
   blueCharcoal,
 
-  buttonLightPrimaryDefault,
-  buttonLightPrimaryHover,
-  buttonLightPrimaryPressed,
-  buttonLightPrimaryDisabled,
-  buttonLightPrimaryLoader,
+  blueDenim,
+  blueDenimTransparent,
+  blueMaya,
+  blueSky,
 
   orangeMain,
   orangeHover,
@@ -151,30 +150,29 @@ const Base = {
       baseActive: grayLightMid,
       baseDisabled: grayLight,
       baseLoading: grayLight,
-      //primary color
-      primary: buttonLightPrimaryDefault,
-      primaryHover: buttonLightPrimaryHover,
-      primaryActive: buttonLightPrimaryPressed,
-      primaryDisabled: buttonLightPrimaryDisabled,
-      primaryLoading: buttonLightPrimaryLoader,
+      primary: blueDenim,
+      primaryHover: blueDenimTransparent,
+      primaryActive: blueMaya,
+      primaryDisabled: blueSky,
+      primaryLoading: blueSky,
     },
 
     border: {
       base: `1px solid ${globalColors.grayMid}`,
-      baseHover: `1px solid ${globalColors.buttonLightPrimaryDefault}`,
+      baseHover: `1px solid ${blueDenim}`,
       baseActive: `1px solid ${globalColors.grayMid}`,
       baseDisabled: `1px solid ${globalColors.grayLightMid}`,
       baseLoading: `1px solid ${globalColors.grayLightMid}`,
 
-      primary: `1px solid ${globalColors.buttonLightPrimaryDefault}`,
-      primaryHover: `1px solid ${globalColors.buttonLightPrimaryHover}`,
-      primaryActive: `1px solid ${globalColors.buttonLightPrimaryPressed}`,
-      primaryDisabled: `1px solid ${globalColors.buttonLightPrimaryDisabled}`,
-      primaryLoading: `1px solid ${globalColors.buttonLightPrimaryLoader}`,
+      primary: `1px solid ${blueDenim}`,
+      primaryHover: `1px solid ${blueDenimTransparent}`,
+      primaryActive: `1px solid ${blueMaya}`,
+      primaryDisabled: `1px solid ${blueSky}`,
+      primaryLoading: `1px solid ${blueSky}`,
     },
 
     loader: {
-      base: buttonLightPrimaryDefault,
+      base: blueDenim,
       primary: white,
     },
   },

packages/components/utils/globalColors.js

@@ -25,11 +25,10 @@ const globalColors = {
   blueLightMid: "#265A8F",
   strongBlue: "#316AC5",
 
-  buttonLightPrimaryDefault: "#5299E0",
-  buttonLightPrimaryHover: "rgba(82, 153, 224, 0.85)",
-  buttonLightPrimaryPressed:"#4A8ACA",
-  buttonLightPrimaryDisabled:"#96C1EC",
-  buttonLightPrimaryLoader:"#96C1EC",
+  blueDenim : "#5299E0",
+  blueDenimTransparent: "rgba(82, 153, 224, 0.85)",
+  blueMaya: "#4A8ACA",
+  blueSky: "#96C1EC",
 
   lightGrayishBlue: "#DEE2E6",
   lightGrayishStrongBlue: "#DFE2E3",