leaky-ships/leaky-ships/components/BurgerMenu.tsx

18 lines
712 B
TypeScript

import React from "react"
function BurgerMenu({ onClick }: { onClick?: () => void }) {
return (
<button
className="absolute top-4 left-4 flex h-16 w-16 items-center justify-center rounded-lg border-b-2 border-shield-gray bg-grayish shadow-lg duration-100 active:border-t-2 active:border-b-0 md:top-6 md:left-6 md:h-20 md:w-20 md:rounded-xl md:border-b-4 md:active:border-t-4 lg:top-8 lg:left-8 xl:top-12 xl:left-12 xl:h-24 xl:w-24"
onClick={() => onClick && setTimeout(onClick, 200)}
>
<img
className="pixelart h-12 w-12 md:h-16 md:w-16 xl:h-20 xl:w-20"
src="/assets/burger-menu.png"
alt="Burger Menu"
/>
</button>
)
}
export default BurgerMenu