diff --git a/src/components/header.lisp b/src/components/header.lisp index acb3677..f9bdec0 100644 --- a/src/components/header.lisp +++ b/src/components/header.lisp @@ -29,7 +29,7 @@ (defcomp ~sp-header () (hsx (header - :data-signals-open "false" + :data-signals "{open: false}" :class "flex md:hidden justify-between py-2 border-b-1 top-0 bg-white" (p :class "z-20 text-2xl font-bold" (a :href "/" "skyizwhite")) @@ -38,23 +38,21 @@ :aria-label "Open menu" :class "z-20 size-8 flex flex-col justify-center cursor-pointer relative" :type "button" - :data-on-click "$open = !$open" + :data-on-click__viewtransition "$open = !$open" (div :class "grid justify-items-center gap-1.5" (span - :class "h-1 w-8 rounded-full bg-black transition duration-400" + :class "h-1 w-8 rounded-full bg-black transition duration-300" :data-class "{'rotate-45 translate-y-2.5': $open}") (span - :class "h-1 w-8 rounded-full bg-black transition duration-400" + :class "h-1 w-8 rounded-full bg-black transition duration-300" :data-class "{'scale-x-0': $open}") (span - :class "h-1 w-8 rounded-full bg-black transition duration-400" + :class "h-1 w-8 rounded-full bg-black transition duration-300" :data-class "{'-rotate-45 -translate-y-2.5': $open}"))) (nav - :data-show.duration_300ms "$open" + :data-show "$open" :class (clsx "fixed flex flex-col items-center justify-center" - "z-10 top-0 right-0 w-full h-full gap-16 bg-gray-200" - "transition duration-300 opacity-0") - :data-class "{'opacity-100': $open}" + "z-10 top-0 right-0 w-full h-full gap-16 bg-gray-200") (h2 :class "text-5xl font-bold" "Menu") (ul :class "flex flex-col h-fit gap-8 text-3xl font-bold"