Align color theme with new app

Author: switz

src/components/Column.tsx

@@ -24,7 +24,7 @@ const Column = ({ className, heading, loading, loadingAmount, children }: Column
   return (
     <Flex className={cn('relisten-column flex-1 break-words', className)} column>
       {heading && (
-        <Flex center className="min-h-[32px] w-full bg-relisten-100 text-white">
+        <Flex center className="bg-relisten-600 min-h-[32px] w-full text-white">
           {heading}
         </Flex>
       )}

src/components/Row.tsx

@@ -79,9 +79,9 @@ const Row = ({
             <Spinner />
           </div>
         )}
-        {isPending && <div className="w-2 animate-pulse bg-black/30" />}
+        {isPending && <div className="bg-relisten-600/30 w-2 animate-pulse" />}
 
-        {!isPending && isActive && <div className="w-2 bg-black/75" />}
+        {!isPending && isActive && <div className="bg-relisten-600 w-2" />}
         <Flex className="w-full flex-1 items-center justify-between p-1 leading-tight">
           {children}
         </Flex>

src/styles/globals.css

@@ -4,7 +4,20 @@
   --text-xxs: 0.7rem;
   --text-xxs--line-height: 1rem;
 
-  --color-relisten-100: #279bbc;
+  /* --color-relisten-100: #279bbc; */
+
+  --color-relisten-DEFAULT: #009DC1;
+  --color-relisten-50: #A2EEFF;
+  --color-relisten-100: #8EEAFF;
+  --color-relisten-200: #65E2FF;
+  --color-relisten-300: #3CDBFF;
+  --color-relisten-400: #14D3FF;
+  --color-relisten-500: #00BEEA;
+  --color-relisten-600: #009DC1;
+  --color-relisten-700: #006F89;
+  --color-relisten-800: #004251;
+  --color-relisten-900: #001D24;
+  --color-relisten-950: #001114;
 }
 
 /*