Changeset ba52069 for src/components/navbar.tsx

Timestamp:

02/13/26 19:32:02 (7 months ago)

Author:

Stefan-Saveski <stefansaveski19@…>

Branches:

master

Children:

d7deae5

Parents:

50f2fb4

Message:

Added dark theme.

File:

• src/components/navbar.tsx (modified) (4 diffs)

src/components/navbar.tsx

@@ -32 +32 @@
     <>
       {/* Desktop Navbar */}
-      <nav className="hidden md:flex flex-row gap-2 justify-evenly bg-primary text-white p-7 rounded-xl my-5 text-xl">
+      <nav className="hidden md:flex flex-row gap-2 justify-evenly bg-primary text-primary-foreground p-7 rounded-xl my-5 text-xl">
         {menuItems.map((item, index) => (
           <Link key={index} href={item.href}>
-            <div className="group flex flex-row items-center gap-2 px-3 py-2 rounded-lg cursor-pointer transition-all duration-300 hover:bg-white hover:bg-opacity-20 hover:scale-105 hover:shadow-lg hover:text-primary">
+            <div className="group flex flex-row items-center gap-2 px-3 py-2 rounded-lg cursor-pointer transition-all duration-300 hover:bg-card hover:text-card-foreground hover:scale-105 hover:shadow-lg">
               <FontAwesomeIcon icon={item.icon} className="transition-transform duration-300 group-hover:rotate-12" />
               <span>{item.label}</span>
@@ -44 +44 @@
 
       {/* Mobile Navbar */}
-      <nav className="md:hidden bg-primary text-white rounded-xl my-5">
+      <nav className="md:hidden bg-primary text-primary-foreground rounded-xl my-5">
         <div className="flex justify-between items-center p-4">
           {/* IKnow Logo/Text */}
@@ -55 +55 @@
           <button
             onClick={toggleMenu}
-            className="p-2 rounded-lg hover:bg-white hover:bg-opacity-20 transition-colors duration-300"
+            className="p-2 rounded-lg hover:bg-card hover:text-card-foreground transition-colors duration-300"
           >
             <FontAwesomeIcon 
@@ -71 +71 @@
             {menuItems.map((item, index) => (
               <Link key={index} href={item.href}>
-                <div className="group flex flex-row items-center gap-3 px-3 py-3 rounded-lg cursor-pointer transition-all duration-300 hover:bg-white hover:bg-opacity-20 hover:text-primary">
+                <div className="group flex flex-row items-center gap-3 px-3 py-3 rounded-lg cursor-pointer transition-all duration-300 hover:bg-card hover:text-card-foreground">
                   <FontAwesomeIcon icon={item.icon} className="transition-transform duration-300 group-hover:rotate-12" />
                   <span className="text-lg">{item.label}</span>