Merge pull request #125 from RocketCommunicationsInc/ASTRO-1388

Hot fix for erroneous colors
RocketCommunicationsInc · May 5, 2021 · b6244c2 · b6244c2
2 parents 14ecf0c + a23b1cf
commit b6244c2
Show file tree

Hide file tree

Showing 3 changed files with 26 additions and 26 deletions.
diff --git a/src/css/common/_theme--dark.css b/src/css/common/_theme--dark.css
@@ -6,17 +6,17 @@
 	*/
 
 	/* Astro 5 Simplified Colors */
-	--backgroundColor: #101923;
-	--defaultText: #FFFFFF;
-	--secondaryText: #d4d8dd;
-	--globalAppHeader: #172635;
-	--surfaceElements: #1b2d3e;
-	--primary: #4dacff;
-  --primaryLight: #92cbff;
+	--backgroundColor: var(--colorTertiaryDarken3, #101923);
+	--defaultText: var(--colorWhite, #FFFFFF);
+	--secondaryText: var(--colorTertiaryLighten4, #d4d8dd);
+	--globalAppHeader: var(--colorTertiaryDarken2, #172635);
+	--surfaceElements: #1b2d3e; /* TODO: this is an unofficial Astro color, but a required KM color */
+	--primary: var(--colorSecondary, #4dacff);
+  --primaryLight: var(--colorSecondaryLighten2, #92cbff);
   --primaryLightHover: #92cbff4D; /* TODO: this is a temporary fix, the use of opacity from Sketch is new and not accounted for in CSS */
-	--primaryDark: #3a87cf;
-	--primaryElementText: #080c11;
-	--inputBackground: #FFFFFF;
+	--primaryDark: var(--colorSecondaryLighten2, #3a87cf);
+	--primaryElementText: var(--colorTertiaryDarken4, #080c11);
+	--inputBackground: var(--colorWhite, #FFFFFF);
 
 	/* styles */
   --fontColor: var(--defaultText);

diff --git a/src/css/common/_theme--light.css b/src/css/common/_theme--light.css
@@ -6,17 +6,17 @@
 	*/
 
 	/* Astro 5 Simplified Color Palette */
-	--backgroundColor: #eaeef4;
-	--defaultText: #292A2D;
-	--secondaryText: #51555B;
-	--globalAppHeader: #172635;
-	--surfaceElements: #ffffff;
-	--primary: #005A8F;
-	--primaryLight: #2F7AA7;
-  --primaryDark: #004872;
+	--backgroundColor: var(--colorQuaternaryLighten3, #eaeef4);
+	--defaultText: var(--colorQuaternaryDarken4 ,#292A2D);
+	--secondaryText: var(--colorQuaternaryDarken3, #51555B);
+	--globalAppHeader: var(--colorTertiaryDarken2, #172635);
+	--surfaceElements: var(--colorWhite, #ffffff);
+	--primary: var(--colorPrimary, #005A8F);
+	--primaryLight: var(--colorPrimaryLighten1, #2F7AA7);
+  --primaryDark: var(--colorPrimaryDarken1, #004872);
   --primaryDarkHover: #0048724D; /* TODO: this is a temporary fix, the use of opacity from Sketch is new and not accounted for in CSS */
-	--primaryElementText: #ffffff;
-	--inputBackground: #ffffff;
+	--primaryElementText: var(--colorWhite, #ffffff);
+	--inputBackground: var(--colorWhite, #ffffff);
 
   /* styles */
   --fontColor: var(--defaultText);

diff --git a/src/css/common/_variables.css b/src/css/common/_variables.css
@@ -34,7 +34,7 @@
   --colorPrimary: rgb(0, 90, 143);
   --colorSecondary: rgb(77, 172, 255);
   --colorTertiary: rgb(40, 63, 88);
-  --colorQuaternary: rgb(207, 214, 227);
+  --colorQuaternary: rgb(206, 214, 228);
 
   --statusDarkCritical: rgb(255, 56, 56);
   --statusDarkSerious: rgb(255, 179, 0);
@@ -74,27 +74,27 @@
   --colorPrimaryDarken4: rgb(0, 18, 29);
 
   --colorSecondaryLighten1: rgb(113, 189, 255);
-  --colorSecondaryLighten2: rgb(148, 205, 255);
+  --colorSecondaryLighten2: rgb(146,203,255);
   --colorSecondaryLighten3: rgb(184, 222, 255);
   --colorSecondaryLighten4: rgb(219, 238, 255);
   --colorSecondaryDarken1: rgb(62, 138, 204);
   --colorSecondaryDarken2: rgb(46, 103, 153);
   --colorSecondaryDarken3: rgb(31, 69, 102);
   --colorSecondaryDarken4: rgb(15, 34, 51);
 
-  --colorTertiaryLighten1: rgb(83, 101, 121);
+  --colorTertiaryLighten1: rgb(82, 102, 122);
   --colorTertiaryLighten2: rgb(126, 140, 155);
   --colorTertiaryLighten3: rgb(169, 178, 188);
   --colorTertiaryLighten4: rgb(212, 217, 222);
-  --colorTertiaryDarken1: rgb(32, 50, 70);
+  --colorTertiaryDarken1: rgb(31, 51, 71);
   --colorTertiaryDarken2: rgb(24, 38, 53);
   --colorTertiaryDarken3: rgb(16, 25, 35);
   --colorTertiaryDarken4: rgb(8, 13, 18);
 
   --colorQuaternaryLighten1: rgb(217, 222, 233);
-  --colorQuaternaryLighten2: rgb(226, 230, 238);
+  --colorQuaternaryLighten2: rgb(225, 230, 239);
   --colorQuaternaryLighten3: rgb(236, 239, 244);
-  --colorQuaternaryLighten4: rgb(245, 247, 249);
+  --colorQuaternaryLighten4: rgb(245, 246, 249);
   --colorQuaternaryDarken1: rgb(166, 171, 182);
   --colorQuaternaryDarken2: rgb(124, 128, 136);
   --colorQuaternaryDarken3: rgb(83, 86, 91);