Merge pull request #66 from dev129/feat-NavbarRedesign

Navbar Redesign
iamkanhaiyakumar · Oct 29, 2024 · 523e2d3 · 523e2d3
2 parents 50efdde + cc31ed9
commit 523e2d3
Showing 1 changed file with 30 additions and 7 deletions.
diff --git a/components/public-header.tsx b/components/public-header.tsx
@@ -22,10 +22,25 @@ const PublicHeader = () => {
     <header className="bg-gray-900 shadow-md px-2 sm:px-3 md:px-0">
       <div className="container mx-auto py-4">
         <nav className="flex justify-between items-center">
-          <div className="flex items-center space-x-4">
-            <span className="text-lg sm:text-xl md:text-2xl font-bold text-white w-fit">
-              AI Content Generator
-            </span>
+          <div className="flex-shrink-0 flex items-center">
+            <Link href="/" className="flex items-center space-x-3">
+              <div className="relative h-8 w-8 sm:h-10 sm:w-10">
+                <img
+                  src='https://cdni.iconscout.com/illustration/premium/thumb/confused-ai-robot-illustration-download-in-svg-png-gif-file-formats--server-storage-artificial-intelligence-database-pack-science-technology-illustrations-8990982.png?f=webp'
+                  className="rounded-lg"
+                  height={100}
+                  width={100}
+                />
+              </div>
+              <div className="flex flex-col">
+                <span className="text-base sm:text-lg font-bold text-white whitespace-nowrap">
+                  AI Content Generator
+                </span>
+                <span className="hidden sm:block text-xs text-gray-600 whitespace-nowrap">
+                  Your ideas , our intelligence
+                </span>
+              </div>
+            </Link>
           </div>
           <div className="hidden md:flex space-x-6">
             {navItems.map((item) => (
@@ -42,7 +57,7 @@ const PublicHeader = () => {
             <SignedIn>
               <Link href="/dashboard">
                 <Button className="w-full border-[#704ef8] text-[#704ef8] hover:bg-[#704ef8] hover:text-white bg-slate-200">
-                  Go To Dashboard
+                  Dashboard
                 </Button>
               </Link>
               <UserButton />
@@ -68,10 +83,10 @@ const PublicHeader = () => {
               <SignedIn>
                 <Link href="/dashboard">
                   <Button
-                    className="w-full border-[#704ef8] text-[#704ef8] hover:bg-[#704ef8] hover:text-white bg-slate-200"
+                    className="w-full hidden md:flex border-[#704ef8] text-[#704ef8] hover:bg-[#704ef8] hover:text-white bg-slate-200"
                     size={"sm"}
                   >
-                    Go To Dashboard
+                     Dashboard
                   </Button>
                 </Link>
                 <UserButton />
@@ -99,6 +114,9 @@ const PublicHeader = () => {
                 </SheetTitle>
               </SheetHeader>
               <nav className="flex flex-col space-y-4 mt-8">
+                <SignedIn>
+
+                </SignedIn>
                 {navItems.map((item) => (
                   <SheetClose key={item.name} className="text-left">
                     <Link
@@ -109,6 +127,11 @@ const PublicHeader = () => {
                     </Link>
                   </SheetClose>
                 ))}
+                <Link href="/dashboard">
+                    <Button className="text-gray-300 hover:text-white transition-colors w-full">
+                      Dashboard
+                    </Button>
+                  </Link>
               </nav>
             </SheetContent>
           </Sheet>