Improve nav menu
This commit is contained in:
parent
1b407e7d12
commit
7821782646
1 changed files with 6 additions and 3 deletions
|
@ -5,11 +5,14 @@
|
||||||
(:export #:~header))
|
(:export #:~header))
|
||||||
(in-package #:website/components/header)
|
(in-package #:website/components/header)
|
||||||
|
|
||||||
(defparameter *nav-menu*
|
(defparameter *pc-menu*
|
||||||
'(("/about" "about")
|
'(("/about" "about")
|
||||||
("/works" "works")
|
("/works" "works")
|
||||||
("/blog" "blog")))
|
("/blog" "blog")))
|
||||||
|
|
||||||
|
(defparameter *sp-menu*
|
||||||
|
(cons '("/" "home") *pc-menu*))
|
||||||
|
|
||||||
(defcomp ~pc-header ()
|
(defcomp ~pc-header ()
|
||||||
(hsx
|
(hsx
|
||||||
(header :class "hidden md:flex justify-between py-4 border-b-1 top-0 bg-white"
|
(header :class "hidden md:flex justify-between py-4 border-b-1 top-0 bg-white"
|
||||||
|
@ -18,7 +21,7 @@
|
||||||
(nav :class "flex items-end"
|
(nav :class "flex items-end"
|
||||||
(ul :preload "mouseover" :class "flex gap-4 text-xl font-bold"
|
(ul :preload "mouseover" :class "flex gap-4 text-xl font-bold"
|
||||||
(loop
|
(loop
|
||||||
:for (href label) :in *nav-menu* :collect
|
:for (href label) :in *pc-menu* :collect
|
||||||
(if (string= href (request-uri *request*))
|
(if (string= href (request-uri *request*))
|
||||||
(hsx (li :class "text-pink-500" label))
|
(hsx (li :class "text-pink-500" label))
|
||||||
(hsx (li (a :href href :class "hover:text-pink-500" label))))))))))
|
(hsx (li (a :href href :class "hover:text-pink-500" label))))))))))
|
||||||
|
@ -59,7 +62,7 @@
|
||||||
:preload "mousedown"
|
:preload "mousedown"
|
||||||
:class "flex flex-col h-fit gap-8 text-3xl font-bold"
|
:class "flex flex-col h-fit gap-8 text-3xl font-bold"
|
||||||
(loop
|
(loop
|
||||||
:for (href label) :in (append '(("/" "home")) *nav-menu*) :collect
|
:for (href label) :in *sp-menu* :collect
|
||||||
(if (string= href (request-uri *request*))
|
(if (string= href (request-uri *request*))
|
||||||
(hsx (li :class "text-pink-500" label))
|
(hsx (li :class "text-pink-500" label))
|
||||||
(hsx (li (a :href href :class "hover:text-pink-500" label)))))))))))
|
(hsx (li (a :href href :class "hover:text-pink-500" label)))))))))))
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue