paku/website
1
0
Fork 0
Code Issues4 Pull requests Projects Releases Packages Wiki Activity Actions

Improve transition

Browse source
This commit is contained in:
Akira Tempaku 2025-06-11 23:38:24 +09:00
parent 8580db7e12
commit 7f5a9187cc
Signed by: paku
GPG key ID: 5B4E8402BCC50607
2 changed files with 7 additions and 7 deletions

12
src/components/header.lisp
View file

@ -41,21 +41,21 @@
:@click "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-200"
:|:class| "open && 'rotate-45 translate-y-2.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-200"
:|:class| "open && 'scale-x-0'")
(span
:class "h-1 w-8 rounded-full bg-black transition duration-400"
:class "h-1 w-8 rounded-full bg-black transition duration-200"
:|:class| "open && '-rotate-45 -translate-y-2.5'")))
(nav
: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")
:x-show "open"
:x-transition.opacity t
:|x-transition:enter.duration.300ms| t
:|x-transition:leave.duration.300ms| t
:x-transition t
:|x-transition:enter.duration.200ms| t
:|x-transition:leave.duration.200ms| t
(h2 :class "text-5xl font-bold"
"Menu")
(ul :class "flex flex-col h-fit gap-8 text-3xl font-bold"

2
src/components/scripts.lisp
View file

@ -23,5 +23,5 @@
:onload "this.onload=null;this.rel='stylesheet'")
(noscript
(link :rel "stylesheet" :href *google-font-url*))
(script :src "https://cdn.jsdelivr.net/npm/htmx.org@2.0.4/dist/htmx.min.js")
;(script :src "https://cdn.jsdelivr.net/npm/htmx.org@2.0.4/dist/htmx.min.js")
(script :src "https://cdn.jsdelivr.net/npm/alpinejs@3.14.9/dist/cdn.min.js" :defer t))))