fix(accordion): place children inside content div and add group wrapper
Children were appended to the outer <details> element instead of inside the .accordion-content div, causing text to render outside the accordion box. Also adds .accordion-group wrapper to eliminate parent gap between stacked items, and styles content with smaller font and muted color.
This commit is contained in:
@@ -25,27 +25,24 @@
|
||||
class (str " " class))
|
||||
base-attrs (cond-> (merge {:class classes} attrs)
|
||||
open (assoc :open true))]
|
||||
(into [:details base-attrs
|
||||
[:summary {:class "accordion-trigger"} title]
|
||||
[:div {:class "accordion-content"}]]
|
||||
children))
|
||||
[:details base-attrs
|
||||
[:summary {:class "accordion-trigger"} title]
|
||||
(into [:div {:class "accordion-content"}] children)])
|
||||
|
||||
:cljs
|
||||
(let [cls (accordion-class-list {})
|
||||
classes (cond-> cls class (conj class))
|
||||
base-attrs (cond-> (merge {:class classes} attrs)
|
||||
open (assoc :open true))]
|
||||
(into [:details base-attrs
|
||||
[:summary {:class ["accordion-trigger"]} title]
|
||||
[:div {:class ["accordion-content"]}]]
|
||||
children))
|
||||
[:details base-attrs
|
||||
[:summary {:class ["accordion-trigger"]} title]
|
||||
(into [:div {:class ["accordion-content"]}] children)])
|
||||
|
||||
:clj
|
||||
(let [classes (cond-> (accordion-classes {})
|
||||
class (str " " class))
|
||||
base-attrs (cond-> (merge {:class classes} attrs)
|
||||
open (assoc :open true))]
|
||||
(into [:details base-attrs
|
||||
[:summary {:class "accordion-trigger"} title]
|
||||
[:div {:class "accordion-content"}]]
|
||||
children))))
|
||||
[:details base-attrs
|
||||
[:summary {:class "accordion-trigger"} title]
|
||||
(into [:div {:class "accordion-content"}] children)])))
|
||||
|
||||
Reference in New Issue
Block a user