fix: align dev target inconsistencies across hiccup, replicant, squint

- Squint section helper: add missing inner flex-column wrapper div
  (was putting children directly in section, unlike hiccup/replicant)
- Hiccup accordion text: shorten to match replicant/squint wording
- Squint dialog ID: rename "demo-dialog-sq" → "demo-dialog" to match others
This commit is contained in:
Florian Schroedl
2026-03-03 11:41:14 +01:00
parent 18043cb150
commit a9f4f4158c
2 changed files with 11 additions and 11 deletions

View File

@@ -70,9 +70,9 @@
;; ── Accordion ───────────────────────────────────────────────────────
(defn accordion-demo []
(section "Accordion"
(accordion/accordion {:title "What is this framework?"} "A cross-target component library for Clojure, ClojureScript, and Squint.")
(accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call the component functions.")
(accordion/accordion {:title "Is it accessible?"} "Yes, components follow ARIA best practices.")))
(accordion/accordion {:title "What is this framework?"} "A cross-target component library.")
(accordion/accordion {:title "How do I use it?" :open true} "Just require the namespace and call functions.")
(accordion/accordion {:title "Is it accessible?"} "Yes, follows ARIA best practices.")))
;; ── Table ───────────────────────────────────────────────────────────
(defn table-demo []

View File

@@ -22,10 +22,10 @@
(if (= current "dark") "light" "dark"))))
(defn section [title & children]
(into [:section {:style {"margin-bottom" "2.5rem"}}
[:section {:style {"margin-bottom" "2.5rem"}}
[:h3 {:style {"color" "var(--fg-1)" "margin-bottom" "1rem"
"border-bottom" "var(--border-0)" "padding-bottom" "0.5rem"}} title]]
children))
"border-bottom" "var(--border-0)" "padding-bottom" "0.5rem"}} title]
(into [:div {:style {"display" "flex" "flex-direction" "column" "gap" "1rem"}}] children)])
;; ── Button ──────────────────────────────────────────────────────────
(def button-variants ["primary" "secondary" "ghost" "danger"])
@@ -97,18 +97,18 @@
[:p {:style {"color" "var(--fg-2)" "font-size" "var(--font-sm)"}} "Click button to open dialog."]
(button/button {:variant "primary"
:on-click (fn [_]
(when-let [el (js/document.getElementById "demo-dialog-sq")]
(when-let [el (js/document.getElementById "demo-dialog")]
(.showModal el)))}
"Open dialog")
(dialog/dialog {:id "demo-dialog-sq"}
(dialog/dialog {:id "demo-dialog"}
(dialog/dialog-header {} [:h3 "Dialog Title"] [:p "Are you sure you want to continue?"])
(dialog/dialog-body {} [:p "This action cannot be undone."])
(dialog/dialog-footer {}
(button/button {:variant "secondary" :size "sm"
:on-click (fn [_] (.close (js/document.getElementById "demo-dialog-sq")))}
:on-click (fn [_] (.close (js/document.getElementById "demo-dialog")))}
"Cancel")
(button/button {:variant "primary" :size "sm"
:on-click (fn [_] (.close (js/document.getElementById "demo-dialog-sq")))}
:on-click (fn [_] (.close (js/document.getElementById "demo-dialog")))}
"Confirm")))))
;; ── Spinner ─────────────────────────────────────────────────────────