stacked radios

This commit is contained in:
2023-10-20 13:56:59 -07:00
parent c0db7eb763
commit 8684a68471
3 changed files with 29 additions and 6 deletions

View File

@@ -1404,6 +1404,10 @@ input:checked + .toggle-bg {
width: 100%;
}
.w-auto {
width: auto;
}
.max-w-2xl {
max-width: 42rem;
}
@@ -1444,6 +1448,10 @@ input:checked + .toggle-bg {
flex-shrink: 1;
}
.shrink-0 {
flex-shrink: 0;
}
.basis-1\/4 {
flex-basis: 25%;
}

View File

@@ -546,7 +546,8 @@
:errors (fc/field-errors)}
(com/radio {:options (ref->radio-options "transaction-approval-status")
:value (fc/field-value)
:name (fc/field-name)})))
:name (fc/field-name)
:orientation :horizontal})))
[:div#form-errors [:span.error-content
(com/errors {:errors (:errors fc/*form-errors*)})]]
@@ -554,6 +555,12 @@
"Save")])]]
[:div])))
;; TODO Should forms have some kind of helper to render an individual field? saving
;; could generate the entire form and swap if there are errors
;; but also when you tab out it could call the same function, and just
;; pull out the single field to swap
(defn new-account [{{:keys [client-id index]} :query-params}]
(let [index (or index 0) ;; TODO schema decode is not working
transaction-rule {:transaction-rule/client (dc/pull (dc/db conn) '[:client/name :client/locations :db/id]

View File

@@ -1,10 +1,15 @@
(ns auto-ap.ssr.components.radio)
(ns auto-ap.ssr.components.radio
(:require [auto-ap.ssr.hiccup-helper :as hh]))
(defn radio- [{:keys [options name title size] :or {size :medium} selected-value :value}]
(defn radio- [{:keys [options name title size orientation] :or {size :medium} selected-value :value}]
[:h3 {:class "mb-4 font-semibold text-gray-900 dark:text-white"} title]
[:ul {:class "w-48 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-lg dark:bg-gray-700 dark:border-gray-600 dark:text-white"}
[:ul {:class (cond-> "w-48 text-sm font-medium text-gray-900 bg-white border border-gray-200 rounded-lg dark:bg-gray-700 dark:border-gray-600 dark:text-white"
(= orientation :horizontal) (-> (hh/add-class "flex gap-8")
(hh/remove-wildcard ["w-" "rounded-lg" "border" "bg-"])))}
(for [{:keys [value content]} options]
[:li {:class "w-full border-b border-gray-200 rounded-t-lg dark:border-gray-600"}
[:li {:class (cond-> "w-full border-b border-gray-200 rounded-t-lg dark:border-gray-600"
(= orientation :horizontal) (-> (hh/remove-wildcard ["w-full" "rounded-"])
(hh/add-class "w-auto shrink-0 block rounded-lg border border-gray-200 dark:border-gray-600 px-3")))}
[:div {:class "flex items-center pl-3"}
[:input (cond-> {:id (str "list-" name "-" value)
:type "radio",
@@ -25,4 +30,7 @@
(str " " "text-xs py-2")
(= size :medium)
(str " " "text-sm py-3"))} content]]])])
(str " " "text-sm py-3")
(= orientation :horizontal)
(hh/remove-class "w-full"))} content]]])])