From e61e5e7ce56dc4ec3a674fcf680ec370e5baeb6d Mon Sep 17 00:00:00 2001
From: iamkiddy <francisyoungson@gmail.com>
Date: Sat, 26 Apr 2025 23:15:44 +0000
Subject: [PATCH] fix: correct translation direction for link label animation
 in Sidebar component

---
 components/Side_bar.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/components/Side_bar.tsx b/components/Side_bar.tsx
index cae68a7..bcf32a6 100644
--- a/components/Side_bar.tsx
+++ b/components/Side_bar.tsx
@@ -32,7 +32,7 @@ export default function Sidebar() {
         {/* Menu Icon */}
         <div className="flex md:flex-col items-center gap-4 md:gap-6">
           <div 
-            className="cursor-pointer hover:opacity-80 transition-opacity duration-200"
+            className="cursor-pointer hover:opacity-80 transition-opacity duration-200 mb-5"
             onClick={() => setIsMenuOpen(!isMenuOpen)}
           >
             <Image 
@@ -61,7 +61,7 @@ export default function Sidebar() {
               </div>
               
               {/* Link Label */}
-              <p className={`text-white text-xs mt-1 transition-all duration-300 ease-in-out ${isMenuOpen ? 'opacity-100 translate-x-0' : 'opacity-0 -translate-x-4'} group-hover:opacity-80`}>
+              <p className={`text-white text-xs mt-1 transition-all duration-300 ease-in-out ${isMenuOpen ? 'opacity-100 translate-x-0' : 'opacity-0 translate-x-4'} group-hover:opacity-80`}>
                 {link.label}
               </p>
             </div>