From a2ba85e04c6e218022689d99edcfe80d3279f60d Mon Sep 17 00:00:00 2001
From: Luffy-456 <anshuman567.in@gmail.com>
Date: Mon, 1 Jun 2026 18:19:40 +0530
Subject: [PATCH 1/2] fixed the moon icon & added animation

---
 src/components/Navbar.tsx |  8 ++++----
 src/index.css             | 18 ++++++++++++++++++
 2 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index fd5eac86..fed84cc7 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -77,20 +77,20 @@ const Navbar: React.FC = () => {
           {/* Theme Toggle */}
           <button
             onClick={toggleTheme}
-            className="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
+            className="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors transition-all ani-fade-in duration-100"
             aria-label="Toggle Theme"
           >
             {mode === "dark" ? (
               <Sun className="h-5 w-5 text-yellow-400" />
             ) : (
-              <Moon className="h-5 w-5 text-white" />
+              <Moon className="h-5 w-5 text-black" />
             )}
           </button>
 
           {/* Menu Toggle */}
           <button
             onClick={() => setIsOpen(!isOpen)}
-            className="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors"
+            className="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors transition-all ani-fade-in duration-100"
             aria-label="Toggle Menu"
           >
             {isOpen ? (
@@ -104,7 +104,7 @@ const Navbar: React.FC = () => {
 
       {/* Mobile Menu */}
       {isOpen && (
-        <div className="md:hidden border-t border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-900">
+        <div className="md:hidden border-t border-gray-200 dark:border-gray-800 bg-white dark:bg-gray-900 transition-all ani-fade-in duration-100">
           <div className="px-6 py-5 flex flex-col gap-3">
 
             <NavLink
diff --git a/src/index.css b/src/index.css
index 3f5943c5..b422a729 100644
--- a/src/index.css
+++ b/src/index.css
@@ -89,3 +89,21 @@
 .icon-issue-closed {
   color: #cf222e;
 }
+
+@layer utilities{
+  @keyframes fade-in{
+    from {
+      opacity:0; 
+      transform: translateY(20px); 
+      filter:blur(45px);
+    }
+    to{
+      opacity:1;
+      transform: translateY(0); 
+      filter:blur(0);
+    }
+  }
+  .ani-fade-in{
+    animation: fade-in 0.8s ease-out both;
+  }
+}
\ No newline at end of file

From f7259d3114ab4610a75f8f507b28665fdebba286 Mon Sep 17 00:00:00 2001
From: Luffy-456 <anshuman567.in@gmail.com>
Date: Mon, 1 Jun 2026 18:41:33 +0530
Subject: [PATCH 2/2] Refactor menu toggle function to use previous state

---
 src/components/Navbar.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx
index fed84cc7..059fb45a 100644
--- a/src/components/Navbar.tsx
+++ b/src/components/Navbar.tsx
@@ -89,7 +89,7 @@ const Navbar: React.FC = () => {
 
           {/* Menu Toggle */}
           <button
-            onClick={() => setIsOpen(!isOpen)}
+            onClick={() => setIsOpen((prev)=>!prev)}
             className="p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors transition-all ani-fade-in duration-100"
             aria-label="Toggle Menu"
           >