fixed the ui bug

Prachi0306 · Prachi0306 · commit 404501d0710e · 2025-11-06T19:03:55.000+05:30
diff --git a/src/app/dashboard/page.tsx b/src/app/dashboard/page.tsx
@@ -1,5 +1,5 @@
 "use client";
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState, useRef } from 'react';
 import { Star, Clock, Filter } from 'lucide-react';
 import { useRouter } from 'next/navigation';
 import { NavbarDemo } from "@/components/nav";
@@ -69,7 +69,8 @@ const AcademicHub = () => {
   const [isLoading, setIsLoading] = useState(false);
   const [searchQuery, setSearchQuery] = useState("");
 
-  const allProjects = [
+  // Core projects without duplicates
+  const coreProjects = [
     {
       id: 1,
       title: "Assignment-Med",
@@ -126,6 +127,11 @@ const AcademicHub = () => {
       tagColor: "bg-green-500",
       tags: ["ai", "generator", "free", "instant"],
     },
+  ];
+
+  // Combine with mock projects (starting from id 5 to avoid duplicates)
+  const allProjects = [
+    ...coreProjects,
     ...MOCK_PROJECTS.map((project, index) => ({
       id: index + 5,
       title: project.title,
@@ -137,9 +143,10 @@ const AcademicHub = () => {
       price: project.price,
       originalPrice: project.price * 2,
       tag: project.badge || "Available",
-      tagColor: project.badge === "Best Seller" ? "bg-amber-500" : 
-                project.badge === "New" ? "bg-emerald-500" : 
-                project.badge === "Popular" ? "bg-blue-500" : "bg-gray-500",
+      tagColor: 
+        project.badge === "Best Seller" ? "bg-amber-500" : 
+        project.badge === "New" ? "bg-emerald-500" : 
+        project.badge === "Popular" ? "bg-blue-500" : "bg-gray-500",
       tags: project.tags,
     }))
   ];
@@ -171,8 +178,11 @@ const AcademicHub = () => {
       <div className={isLoading ? "opacity-0" : "opacity-100 transition-opacity duration-500"}>
         <NavbarDemo searchQuery={searchQuery} setSearchQuery={setSearchQuery} />
 
-        <section className="relative py-20 px-4 sm:px-6 lg:px-8 overflow-hidden">
-          <div className="absolute inset-0 bg-gradient-to-r from-blue-600/20 to-purple-600/20 backdrop-blur-3xl"></div>
+        {/* Hero Section with Gradient Background extending from top */}
+        <section className="relative py-20 px-4 sm:px-6 lg:px-8 overflow-hidden pt-32">
+          {/* Gradient Background - extends to cover navbar area */}
+          <div className="absolute inset-0 -top-20 bg-gradient-to-r from-blue-600/20 to-purple-600/20 backdrop-blur-3xl"></div>
+          
           <div className="relative max-w-4xl mx-auto text-center">
             <h1 className="text-4xl sm:text-5xl lg:text-6xl font-bold mb-6">
               Premium Academic{" "}
diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -119,7 +119,7 @@ export default function HomePage() {
         >
           <Image
             src="/homepage.png"
-            src="/hero-image.png"
+            // src="/hero-image.png"
             alt="hero"
             height={720}
             width={1400}
diff --git a/src/components/nav.tsx b/src/components/nav.tsx
@@ -12,7 +12,7 @@ import {
 } from "@/components/ui/resizable-navbar";
 import { useState, useEffect } from "react";
 import { GitHubStarsButton } from '@/components/animate-ui/buttons/github-stars';
-import { useRouter } from "next/navigation";
+import { useRouter, usePathname } from "next/navigation";
 import { supabase } from "@/lib/supabaseclient";
 import type { User } from '@supabase/supabase-js';
 import Link from "next/link";
@@ -47,6 +47,13 @@ export function NavbarDemo({ searchQuery = "", setSearchQuery }: NavbarDemoProps
   const [showMobileSearch, setShowMobileSearch] = useState(false);
   const [user, setUser] = useState<User | null>(null);
   const router = useRouter();
+  const pathname = usePathname();
+
+  // Only show navbar if NOT on homepage or landing page
+  const shouldShowNavbar = pathname !== '/' && pathname !== '/home';
+
+  // Only show search on dashboard page
+  const showSearch = pathname === '/dashboard' && setSearchQuery;
 
   useEffect(() => {
     if (!supabase) return;
@@ -72,6 +79,11 @@ export function NavbarDemo({ searchQuery = "", setSearchQuery }: NavbarDemoProps
     }
   };
 
+  // Don't render navbar on homepage
+  if (!shouldShowNavbar) {
+    return null;
+  }
+
   return (
     <div className="relative w-full">
       <Navbar>
@@ -82,26 +94,26 @@ export function NavbarDemo({ searchQuery = "", setSearchQuery }: NavbarDemoProps
             <NavItems items={navItems} />
           </div>
 
-          {/* Desktop Search Bar */}
-          {setSearchQuery && (
+          {/* Desktop Search - Only on Dashboard */}
+          {showSearch && (
             <div className="hidden md:flex items-center mr-4">
               <div className="relative">
                 <input
                   type="text"
                   placeholder="Search projects..."
                   value={searchQuery}
                   onChange={(e) => setSearchQuery(e.target.value)}
-                  className="w-64 px-4 py-2 pl-10 bg-white/10 backdrop-blur-sm border border-white/20 
-                             rounded-full text-white placeholder-white/50 
-                             focus:outline-none focus:border-blue-400 focus:ring-2 
-                             focus:ring-blue-400/50 transition-all"
+                  className="w-64 px-4 py-2 pl-10 bg-white/5 backdrop-blur-md border border-white/10 
+                             rounded-full text-white placeholder-white/40 
+                             focus:outline-none focus:border-white/30 focus:bg-white/5
+                             transition-all duration-200"
                 />
-                <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-white/50" />
+                <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-4 h-4 text-white/40" />
                 {searchQuery && (
                   <button
                     onClick={clearSearch}
                     className="absolute right-3 top-1/2 -translate-y-1/2 
-                               text-white/50 hover:text-white transition-colors"
+                               text-white/40 hover:text-white transition-colors"
                     aria-label="Clear search"
                   >
                     <X className="w-4 h-4" />
@@ -126,8 +138,8 @@ export function NavbarDemo({ searchQuery = "", setSearchQuery }: NavbarDemoProps
           <MobileNavHeader>
             <NavbarLogo />
             <div className="flex items-center gap-2">
-              {/* Mobile Search Toggle */}
-              {setSearchQuery && (
+              {/* Mobile Search Toggle - Only on Dashboard */}
+              {showSearch && (
                 <button
                   onClick={() => setShowMobileSearch(!showMobileSearch)}
                   className="text-white/90 hover:text-white transition-colors md:hidden"
@@ -143,26 +155,26 @@ export function NavbarDemo({ searchQuery = "", setSearchQuery }: NavbarDemoProps
             </div>
           </MobileNavHeader>
 
-          {/* Mobile Search Bar (appears below header when toggled) */}
-          {showMobileSearch && setSearchQuery && (
+          {/* Mobile Search Bar */}
+          {showMobileSearch && showSearch && (
             <div className="px-4 py-3 border-t border-white/10 md:hidden">
               <div className="relative">
                 <input
                   type="text"
                   placeholder="Search projects..."
                   value={searchQuery}
                   onChange={(e) => setSearchQuery(e.target.value)}
-                  className="w-full px-4 py-3 pl-10 bg-white/10 backdrop-blur-sm border border-white/20 
-                             rounded-full text-white placeholder-white/50 
-                             focus:outline-none focus:border-blue-400 focus:ring-2 
-                             focus:ring-blue-400/50 transition-all"
+                  className="w-full px-4 py-3 pl-10 bg-white/5 backdrop-blur-sm border border-white/10 
+                             rounded-lg text-white placeholder-white/40 
+                             focus:outline-none focus:border-white/30 focus:bg-white/5
+                             transition-all"
                 />
-                <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-white/50" />
+                <Search className="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-white/40" />
                 {searchQuery && (
                   <button
                     onClick={clearSearch}
                     className="absolute right-3 top-1/2 -translate-y-1/2 
-                               text-white/50 hover:text-white transition-colors"
+                               text-white/40 hover:text-white transition-colors"
                     aria-label="Clear search"
                   >
                     <X className="w-5 h-5" />
diff --git a/src/components/navbar1.tsx b/src/components/navbar1.tsx

Original file line number	Diff line number	Diff line change
`@@ -119,7 +119,7 @@ export default function HomePage() {`
`119`	`119`	`>`
`120`	`120`	`<Image`
`121`	`121`	`src="/homepage.png"`
`122`		`- src="/hero-image.png"`
	`122`	`+ // src="/hero-image.png"`
`123`	`123`	`alt="hero"`
`124`	`124`	`height={720}`
`125`	`125`	`width={1400}`