Dark Mode: Account Details Modal (#14090)

Co-authored-by: Guillaume Roux <guillaumeroux123@gmail.com>
Co-authored-by: George Marshall <george.marshall@consensys.net>

ui/components/app/modals/account-modal-container/index.scss

@@ -7,12 +7,12 @@
     align-items: center;
     position: relative;
     padding: 5px 0 31px 0;
-    border: 1px solid var(--silver);
+    border: 1px solid var(--color-border-default);
     border-radius: 4px;
   }
 
   &__back {
-    color: var(--dusty-gray);
+    color: var(--color-icon-default);
     position: absolute;
     top: 13px;
     left: 17px;
@@ -31,7 +31,7 @@
     @include H1;
 
     background-color: transparent;
-    color: var(--ui-black);
+    color: var(--color-text-default);
     position: absolute;
     cursor: pointer;
     top: -10px;

ui/components/ui/editable-label/index.scss

@@ -16,10 +16,10 @@
 
     width: 250px;
     text-align: center;
-    border: 1px solid var(--alto);
+    border: 1px solid var(--color-border-default);
 
     &--error {
-      border: 1px solid var(--monzo);
+      border: 1px solid var(--color-error-default);
     }
   }
 
@@ -32,14 +32,14 @@
 
   &__icon {
     cursor: pointer;
-    color: var(--dusty-gray);
+    color: var(--color-icon-default);
   }
 
   &__error {
     @include H7;
 
     left: 8px;
-    color: var(--red);
+    color: var(--color-error-default);
   }
 
   &__error-amount {

ui/components/ui/qr-code/index.scss

@@ -8,20 +8,20 @@
     @include Paragraph;
 
     margin-top: 18px;
-    color: #4d4d4d;
+    color: var(--color-text-muted);
   }
 
   &__message {
     @include H7;
 
-    color: #f7861c;
+    color: var(--color-warning-default);
   }
 
   &__error {
     display: flex;
     justify-content: center;
     align-items: center;
-    color: #f7861c;
+    color: var(--color-warning-default);
     margin-bottom: 9px;
   }
 
@@ -37,7 +37,7 @@
       cursor: pointer;
 
       .qr-code__copy-icon__svg {
-        fill: var(--primary-1);
+        fill: var(--color-primary-default);
       }
     }
   }
@@ -45,7 +45,7 @@
   &__address {
     @include H7;
 
-    background-color: var(--Grey-000);
+    background-color: var(--color-background-alternative);
     width: 76%;
     padding: 8px 12px;
     word-break: break-all;
@@ -59,7 +59,7 @@
     right: 24px;
 
     &__svg {
-      fill: var(--ui-5);
+      fill: var(--color-icon-default);
     }
   }
 }