fix: navbar search bar open indicator.

fezcode · fezcode · commit 8ce79863b4a7 · 2025-11-13T02:04:18.000+03:00
diff --git a/src/components/Layout.js b/src/components/Layout.js
@@ -48,7 +48,7 @@ const Layout = ({ children, toggleModal, isSearchVisible, toggleSearch }) => {
       <Sidebar isOpen={isSidebarOpen} toggleSidebar={toggleSidebar} toggleModal={toggleModal} />
       <div
         className={`flex-1 flex flex-col transition-all duration-300 ${isSidebarOpen ? 'md:ml-64' : 'md:ml-0'}`}>
-        <Navbar toggleSidebar={toggleSidebar} isSidebarOpen={isSidebarOpen} toggleSearch={toggleSearch} />
+        <Navbar toggleSidebar={toggleSidebar} isSidebarOpen={isSidebarOpen} isSearchVisible={isSearchVisible} toggleSearch={toggleSearch} />
         {isSearchVisible && <Search isVisible={isSearchVisible} />}
         <main className="flex-grow">{children}</main>
         <Footer />
diff --git a/src/components/Navbar.js b/src/components/Navbar.js
@@ -3,7 +3,7 @@ import { Link } from 'react-router-dom';
 import Fez from './Fez';
 import { SidebarIcon, UserIcon, BookOpenIcon, MagnifyingGlassIcon } from '@phosphor-icons/react';
 
-const Navbar = ({ toggleSidebar, isSidebarOpen, toggleSearch }) => {
+const Navbar = ({ toggleSidebar, isSidebarOpen, isSearchVisible, toggleSearch }) => {
   const [isScrolled, setIsScrolled] = useState(false);
 
   useEffect(() => {
@@ -81,7 +81,7 @@ const Navbar = ({ toggleSidebar, isSidebarOpen, toggleSearch }) => {
             className="text-gray-300 hover:text-white hover:bg-gray-800 px-2 py-2 rounded-md transition-colors"
             aria-label="Toggle Search"
           >
-            <MagnifyingGlassIcon size={24} />
+            <MagnifyingGlassIcon size={24} className={ isSearchVisible ? `text-primary-400` : ``}/>
           </button>
         </div>
       </div>
