feat(ui): update identifier color selector

cardano-foundation · Dec 17, 2024 · 26872cb · 26872cb
1 parent 41f7027
commit 26872cb
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 11 deletions.
diff --git a/...mponents/CreateIdentifier/components/IdentifierColorSelector/IdentifierColorSelector.scss b/...mponents/CreateIdentifier/components/IdentifierColorSelector/IdentifierColorSelector.scss
@@ -58,29 +58,23 @@
     }
 
     &.green {
-      background: linear-gradient(
-        90.04deg,
-        #667745 28.46%,
-        #879e54 78.5%,
-        #a8c55f 123.53%,
-        #b9cf7c 165.71%
-      );
+      background: var(--ion-color-secondary-gradient-green);
     }
 
     &.dark {
-      background: linear-gradient(91.22deg, #222222 -5.14%, #697949 165.6%);
+      background: var(--ion-color-gradient-dark);
     }
 
     &.brown {
-      background: linear-gradient(90.04deg, #986c32 28.46%, #4c371a 165.71%);
+      background: var(--ion-color-gradient-brown);
     }
 
     &.primary {
-      background: linear-gradient(91.86deg, #92ffc0 28.76%, #00a5e6 119.14%);
+      background: var(--ion-color-primary-gradient);
     }
 
     &.secondary {
-      background: linear-gradient(91.86deg, #363c4a 28.76%, #030321 119.14%);
+      background: var(--ion-color-secondary-gradient);
     }
   }
 }
diff --git a/src/ui/styles/colors.scss b/src/ui/styles/colors.scss
@@ -49,6 +49,18 @@
     #92ffc0 28.76%,
     #47ff94 119.14%
   );
+
+  --ion-color-secondary-gradient-green: linear-gradient(
+    90.04deg,
+    #667745 28.46%,
+    #879e54 78.5%,
+    #a8c55f 123.53%,
+    #b9cf7c 165.71%
+  );
+
+  --ion-color-gradient-dark: linear-gradient(91.22deg, #222222 -5.14%, #697949 165.6%);
+  --ion-color-gradient-brown: linear-gradient(90.04deg, #986c32 28.46%, #4c371a 165.71%);
+  --ion-color-secondary-gradient: linear-gradient(91.86deg, #363c4a 28.76%, #030321 119.14%);
 }
 
 .ion-color-dark-grey {