The space-y-* and space-x-* aliases generate padding rules instead of margin rules, which doesn't match Tailwind's behaviour.
Current (shadow-css 0.6.4):
(:space-y-1 (:aliases (shadow.css.build/start)))
;; => [["& > * + *" {:padding-top "0.25rem", :padding-bottom "0.25rem"}]]
Expected (matching Tailwind):
;; => [["& > * + *" {:margin-top "0.25rem"}]]
Two problems: (1) padding instead of margin — space-y-* should add spacing between children via margin-top, not expand padding. (2) Sets both top and bottom — this overrides any py-* already on the child element, since both target the same properties.
Same issue affects space-x-* (uses padding-left/padding-right instead of margin-left).
Workaround:
(update build-state :aliases merge
{:space-y-1 [["& > * + *" {:margin-top "0.25rem"}]]
:space-x-8 [["& > * + *" {:margin-left "2rem"}]]})
Reproduced on 0.4.6 and 0.6.4.
The
space-y-*andspace-x-*aliases generate padding rules instead of margin rules, which doesn't match Tailwind's behaviour.Current (shadow-css 0.6.4):
Expected (matching Tailwind):
;; => [["& > * + *" {:margin-top "0.25rem"}]]Two problems: (1) padding instead of margin —
space-y-*should add spacing between children viamargin-top, not expand padding. (2) Sets both top and bottom — this overrides anypy-*already on the child element, since both target the same properties.Same issue affects
space-x-*(usespadding-left/padding-rightinstead ofmargin-left).Workaround:
Reproduced on 0.4.6 and 0.6.4.