stacked radios
This commit is contained in:
@@ -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%;
|
||||
}
|
||||
|
||||
@@ -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]
|
||||
|
||||
@@ -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]]])])
|
||||
|
||||
Reference in New Issue
Block a user