From 24cf9bfb1450a8f2d17c44be58271a2272e9f15f Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Tue, 31 Oct 2023 17:47:44 +0000
Subject: [PATCH] make navbar use card

---
 src/components/Navbar.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index 3ce1bf1..06e264c 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -11,6 +11,7 @@ import {
 import { GlobeAltIcon } from "@heroicons/react/24/outline";
 import Avatar from "./Avatar";
 import Button from "./Button";
+import { Card } from "./ui/card";
 
 interface ButtonProps {
   text: string;
@@ -48,7 +49,7 @@ export default function Navbar() {
 
   return (
     <>
-      <div className="bg-background flex h-fit w-full rounded-md">
+      <Card className="flex h-fit w-full rounded-md">
         {settingsStore !== undefined && settingsStore.player && (
           <NavbarButton
             ariaLabel="Your profile"
@@ -127,7 +128,7 @@ export default function Navbar() {
           icon={<CogIcon height={20} width={20} />}
           href="/settings"
         />
-      </div>
+      </Card>
     </>
   );
 }