From 08891e20ca637b1183bd90d566eedf6cdf960241 Mon Sep 17 00:00:00 2001
From: eshanized <m.eshanized@gmail.com>
Date: Fri, 27 Dec 2024 21:31:39 +0530
Subject: [PATCH] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20perf(smooth):=20removed=20?=
 =?UTF-8?q?libs=20and=20smooth=20transition=20++?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/ThemeToggle.tsx | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/src/components/ThemeToggle.tsx b/src/components/ThemeToggle.tsx
index 271bae0..4e0584c 100644
--- a/src/components/ThemeToggle.tsx
+++ b/src/components/ThemeToggle.tsx
@@ -1,4 +1,3 @@
-import React from 'react';
 import { Moon, Sun } from 'lucide-react';
 import { useTheme } from '../hooks/useTheme';
 
@@ -8,14 +7,14 @@ export function ThemeToggle() {
   return (
     <button
       onClick={toggleTheme}
-      className="p-2 rounded-lg bg-nord-8/10 hover:bg-nord-8/20 transition-colors"
+      className="p-3 rounded-full bg-nord-8/10 dark:bg-nord-8/20 hover:bg-nord-8/20 dark:hover:bg-nord-8/30 transition-all ease-in-out duration-300"
       aria-label="Toggle theme"
     >
       {theme === 'dark' ? (
-        <Sun className="h-5 w-5 text-nord-4" />
+        <Sun className="h-6 w-6 text-nord-4 transition-transform transform rotate-0 dark:rotate-180" />
       ) : (
-        <Moon className="h-5 w-5 text-nord-4" />
+        <Moon className="h-6 w-6 text-nord-4 transition-transform transform rotate-360 dark:rotate-360" />
       )}
     </button>
   );
-}
\ No newline at end of file
+}