Add parenscript

qlfile

@@ -7,4 +7,5 @@ ql cl-ppcre
 ql log4cl
 ql function-cache
 ql trivial-backtrace
-ql cl-interpol
+ql parenscript
+ql paren6

qlfile.lock

@@ -38,7 +38,11 @@
  (:class qlot/source/ql:source-ql
   :initargs (:%version :latest)
   :version "ql-2023-10-21"))
-("cl-interpol" .
+("parenscript" .
+ (:class qlot/source/ql:source-ql
+  :initargs (:%version :latest)
+  :version "ql-2023-10-21"))
+("paren6" .
  (:class qlot/source/ql:source-ql
   :initargs (:%version :latest)
   :version "ql-2023-10-21"))

src/components/layout.lisp

@@ -1,7 +1,8 @@
-(defpackage #:hp/components/layout
+(uiop:define-package #:hp/components/layout
-  (:use #:cl
+  (:use #:cl)
-        #:piccolo
+  (:mix #:parenscript
-        #:cl-interpol)
+        #:paren6
+        #:piccolo)
   (:import-from #:hp/config/asset
                 #:*hx-ext*)
   (:import-from #:hp/view/asset
@@ -9,18 +10,16 @@
   (:export #:layout))
 (in-package #:hp/components/layout)
 
-(named-readtables:in-readtable :interpol-syntax)
-
 (defparameter *header-nav-items*
-  '((:href "/"        :label "Home")
+  '((:href "/"      :label "Home")
-    (:href "/about"   :label "About")
+    (:href "/about" :label "About")
-    (:href "/work"    :label "Work")))
+    (:href "/work"  :label "Work")))
 
 (define-element header-nav-item (href label)
   (li
     :class "px-4 rounded-full"
-    :|:class| #?"isCurrentPath('${href}')
+    :|:class| (ps* `(and (is-current-path ,href)
-                 && 'font-bold bg-indigo-200 pointer-events-none shadow-sm'"
+                         "font-bold bg-indigo-200 pointer-events-none shadow-sm"))
     (a :href href
       label)))
 
@@ -29,12 +28,10 @@
     (h1 :class "font-bold text-xl"
       "skyizwhite.dev")
     (nav
-      :x-data "{
+      :x-data (ps (create6
-        currentPath: window.location.pathname,
+                   (current-path (@ window location pathname))
-        isCurrentPath(path) {
+                   (defun is-current-path (path)
-          return this.currentPath === path
+                     (eql (@ this current-path) path))))
-        }
-      }"
       :hx-boost "true"
       (ul :class "h-full flex items-center gap-6 text-lg"
         (mapcar (lambda (item) (header-nav-item item))

src/routes/index.lisp

@@ -1,15 +1,14 @@
-(defpackage #:hp/routes/index
+(uiop:define-package #:hp/routes/index
-  (:use #:cl
+  (:use #:cl)
-        #:piccolo
+  (:mix #:parenscript
-        #:cl-interpol)
+        #:paren6
+        #:piccolo)
   (:import-from #:hp/view/*
                 #:defasset
                 #:render)
   (:export #:handle-get))
 (in-package #:hp/routes/index)
 
-(named-readtables:in-readtable :interpol-syntax)
-
 (defasset *me-img* :img "me.jpg")
 
 (define-element page ()
@@ -24,11 +23,7 @@
         (h1 :class "text-4xl font-bold"
           "paku (skyizwhite)")
         (p :class "text-xl"
-          "Web developer"
+          "Software developer")
-          (br)
-          "Admin of"
-          (a :target "_blank" :href "https://himagine.club" :class "text-indigo-500"
-            "himagine.club"))
         (ul
           (li
             (span "GitHub:")
@@ -39,12 +34,14 @@
               "@skyizwhite"))
           (li
             (span "Email: ")
-            (let ((email "'paku'+'@'+'skyizwhite.dev'"))
+            (a
-              (a
+              :x-data (ps (create6
-                :x-data t
+                           (email (list6 "paku" "@" "skyizwhite.dev"))
-                :x-text email
+                           (mailto (list6 "mailto:"))))
-                :|:href| #?"'mailto:'+${email}"
+              :x-text (ps (chain email (join "")))
-                :class "text-indigo-500")))
+              :|:href| (ps (chain (list6 :... mailto :... email) (join "")))
+              :|:class| "'text-indigo-500'"
+              "Please enable Javascript to read."))
           (li
             (span "Fediverse(main): ")
             (a