Merge pull request #1035 from equinor/fix/dataviz-primary-gradient-names

Fix/dataviz primary gradient names

Author: aslakihle

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/amplify-component-lib",
-  "version": "9.7.3",
+  "version": "9.7.4",
   "description": "Frontend Typescript components for the Amplify team",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

src/atoms/style/colors.ts

@@ -26,15 +26,15 @@ export const colors = {
       default: 'var(--amplify_dataviz_primary_default, rgba(0, 107, 229, 1))',
       darker: 'var(--amplify_dataviz_primary_darker, rgba(0, 83, 178, 1))',
       lighter: 'var(--amplify_dataviz_primary_lighter, rgba(206, 229, 255, 1))',
-      10: 'var(--amplify_dataviz_primary_10, rgba(235, 245, 255, 1))',
-      20: 'var(--amplify_dataviz_primary_20, rgba(211, 231, 253, 1))',
-      30: 'var(--amplify_dataviz_primary_30, rgba(167, 206, 251, 1))',
-      40: 'var(--amplify_dataviz_primary_40, rgba(133, 187, 250, 1))',
-      50: 'var(--amplify_dataviz_primary_50, rgba(89, 163, 248, 1))',
-      60: 'var(--amplify_dataviz_primary_60, rgba(40, 136, 246, 1))',
-      70: 'var(--amplify_dataviz_primary_70, rgba(0, 107, 229, 1))',
-      80: 'var(--amplify_dataviz_primary_80, rgba(0, 83, 178, 1))',
-      90: 'var(--amplify_dataviz_primary_90, rgba(5, 60, 122, 1))',
+      g10: 'var(--amplify_dataviz_primary_g10, rgba(235, 245, 255, 1))',
+      g20: 'var(--amplify_dataviz_primary_g20, rgba(211, 231, 253, 1))',
+      g30: 'var(--amplify_dataviz_primary_g30, rgba(167, 206, 251, 1))',
+      g40: 'var(--amplify_dataviz_primary_g40, rgba(133, 187, 250, 1))',
+      g50: 'var(--amplify_dataviz_primary_g50, rgba(89, 163, 248, 1))',
+      g60: 'var(--amplify_dataviz_primary_g60, rgba(40, 136, 246, 1))',
+      g70: 'var(--amplify_dataviz_primary_g70, rgba(0, 107, 229, 1))',
+      g80: 'var(--amplify_dataviz_primary_g80, rgba(0, 83, 178, 1))',
+      g90: 'var(--amplify_dataviz_primary_g90, rgba(5, 60, 122, 1))',
     },
     darkblue: {
       default: 'var(--amplify_dataviz_darkblue_default, rgba(0, 71, 153, 1))',

src/atoms/style/lightTokens.ts

@@ -11,15 +11,15 @@ export const lightTokens = css`
     --amplify_dataviz_primary_darker: rgba(0, 83, 178, 1);
     --amplify_dataviz_primary_lighter: rgba(206, 229, 255, 1);
 
-    --amplify_dataviz_primary_10: rgba(235, 245, 255, 1);
-    --amplify_dataviz_primary_20: rgba(211, 231, 253, 1);
-    --amplify_dataviz_primary_30: rgba(167, 206, 251, 1);
-    --amplify_dataviz_primary_40: rgba(133, 187, 250, 1);
-    --amplify_dataviz_primary_50: rgba(89, 163, 248, 1);
-    --amplify_dataviz_primary_60: rgba(40, 136, 246, 1);
-    --amplify_dataviz_primary_70: rgba(0, 107, 229, 1);
-    --amplify_dataviz_primary_80: rgba(0, 83, 178, 1);
-    --amplify_dataviz_primary_90: rgba(5, 60, 122, 1);
+    --amplify_dataviz_primary_g10: rgba(235, 245, 255, 1);
+    --amplify_dataviz_primary_g20: rgba(211, 231, 253, 1);
+    --amplify_dataviz_primary_g30: rgba(167, 206, 251, 1);
+    --amplify_dataviz_primary_g40: rgba(133, 187, 250, 1);
+    --amplify_dataviz_primary_g50: rgba(89, 163, 248, 1);
+    --amplify_dataviz_primary_g60: rgba(40, 136, 246, 1);
+    --amplify_dataviz_primary_g70: rgba(0, 107, 229, 1);
+    --amplify_dataviz_primary_g80: rgba(0, 83, 178, 1);
+    --amplify_dataviz_primary_g90: rgba(5, 60, 122, 1);
 
     --amplify_dataviz_darkblue_default: rgba(0, 71, 153, 1);
     --amplify_dataviz_darkblue_darker: rgba(4, 48, 98, 1);