chore: fix up colors

algorandfoundation · Mar 14, 2024 · 0333746 · 0333746
1 parent 97a7b8a
commit 0333746
Show file tree

Hide file tree

Showing 5 changed files with 16 additions and 12 deletions.
diff --git a/src/features/layout/components/connect-wallet.tsx b/src/features/layout/components/connect-wallet.tsx
@@ -7,7 +7,7 @@ export function ConnectWallet() {
     <div className={cn('flex gap-2')}>
       {/* TODO: add search icon */}
       <Input className={cn('w-96')} />
-      <Button variant={'default'} size={'sm'}>
+      <Button variant={'default'} size={'default'}>
         Connect wallet
       </Button>
     </div>

diff --git a/src/features/layout/components/header.tsx b/src/features/layout/components/header.tsx
@@ -3,9 +3,13 @@ import { ThemeToggle } from '@/features/theme/components/theme-toggle'
 import { NetworkSelect } from './network-select'
 import { ConnectWallet } from './connect-wallet'
 
-export function Header() {
+type Props = {
+  className?: string
+}
+
+export function Header({ className }: Props) {
   return (
-    <div className={cn('bg-secondary flex h-20 flex-row items-end justify-end gap-8 pb-2 pr-4')}>
+    <div className={cn('bg-card flex h-20 flex-row items-end justify-end gap-8 pb-2 pr-4', className)}>
       <ConnectWallet />
       <NetworkSelect />
       <ThemeToggle />

diff --git a/src/features/layout/components/left-side-bar-menu.tsx b/src/features/layout/components/left-side-bar-menu.tsx
@@ -9,7 +9,7 @@ type Props = {
 
 export function LeftSideBarMenu({ className }: Props) {
   return (
-    <NavigationMenu className={cn('bg-secondary', className)}>
+    <NavigationMenu className={cn('bg-card', className)}>
       <NavigationMenuList className={cn('flex-col items-start space-x-0')}>
         <NavigationMenuItem>
           <NavigationMenuLink asChild>

diff --git a/src/features/layout/pages/layout-page.tsx b/src/features/layout/pages/layout-page.tsx
@@ -10,7 +10,7 @@ export interface LayoutPageProps {
 export function LayoutPage({ children }: LayoutPageProps) {
   return (
     <>
-      <Header />
+      <Header className={cn('mb-1')} />
       <div className={cn('flex h-full flex-shrink flex-row')}>
         <LeftSideBarMenu className={cn('w-52')} />
         <div className={cn('grow p-4')}> {children}</div>

diff --git a/src/index.css b/src/index.css
@@ -4,20 +4,20 @@
 
 @layer base {
   :root {
-    --background: 0 0% 100%;
-    --foreground: 222.2 84% 4.9%;
+    --background: 0 0% 90%;
+    --foreground: 0 0% 0%;
 
     --card: 0 0% 100%;
     --card-foreground: 222.2 84% 4.9%;
 
     --popover: 0 0% 100%;
     --popover-foreground: 222.2 84% 4.9%;
 
-    --primary: 173 40% 64%;
-    --primary-foreground: 210 40% 98%;
+    --primary: 171 94% 20%;
+    --primary-foreground: 0 0% 100%;
 
-    --secondary: 210 40% 96.1%;
-    --secondary-foreground: 222.2 47.4% 11.2%;
+    --secondary: 222.2 47.4% 11.2%;
+    --secondary-foreground: 210 40% 96.1%;
 
     --muted: 210 40% 96.1%;
     --muted-foreground: 215.4 16.3% 46.9%;
@@ -39,7 +39,7 @@
     --background: 0 0% 0%;
     --foreground: 0 0% 100%;
 
-    --card: 0 0% 0%;
+    --card: 0 0% 7%;
     --card-foreground: 0 0% 100%;
 
     --popover: 0 0% 0%;