feat: initial commit

src/ui/components/internal/header/mobile-header/utils/menu-burguer-button.tsx

@@ -0,0 +1,41 @@
+'use client';
+
+type MenuBurgerButtonProps = {
+    state: boolean;
+    onStateChange?: (value: boolean) => void;
+};
+
+export const MenuBurgerButton = ({
+    state,
+    onStateChange,
+}: MenuBurgerButtonProps) => {
+    state = state ?? false;
+
+    // This function is called when the button is clicked
+    const handleClick = () => {
+        if (onStateChange) onStateChange(!state);
+    };
+
+    return (
+        <div
+            className='flex flex-col md:hidden w-10 h-10 justify-center items-center cursor-pointer relative'
+            onClick={handleClick}
+        >
+            <span
+                className={`w-8 h-[4px] bg-primary rounded transition-all duration-200 ${
+                    state ? 'opacity-0' : 'opacity-100'
+                }`}
+            />
+            <span
+                className={`absolute w-8 h-[4px] bg-primary rounded transition-all duration-200 ${
+                    state ? 'rotate-45' : '-translate-y-[10px]'
+                }`}
+            />
+            <span
+                className={`absolute w-8 h-[4px] bg-primary rounded transition-all duration-200 ${
+                    state ? '-rotate-45' : 'translate-y-[10px]'
+                }`}
+            />
+        </div>
+    );
+};