flyonui/components/drawer/object.js

The easiest, free and open-source Tailwind CSS component library with semantic classes.

export default {".drawer":{"position":"fixed","z-index":80,"display":"flex","width":"100%","height":"100%","max-width":"calc(0.25rem * 96)","flex-direction":"column","justify-content":"space-between","background-color":"var(--color-base-100)","--tw-shadow":"0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1))","box-shadow":"var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)","--tw-shadow-color":"color-mix(in oklab, color-mix(in oklab, var(--color-base-300) 20%, transparent) var(--tw-shadow-alpha), transparent)"},".drawer-header":{"display":"flex","align-items":"center","justify-content":"space-between","padding":"calc(0.25rem * 6)"},".drawer-title":{"font-size":"var(--text-lg)","line-height":"var(--tw-leading, var(--text-lg--line-height))","--tw-font-weight":"var(--font-weight-medium)","font-weight":"var(--font-weight-medium)","color":"var(--color-base-content)"},".drawer-body":{"flex-grow":1,"overflow-x":"hidden","overflow-y":"auto","padding-inline":"calc(0.25rem * 6)","font-size":"var(--text-base)","line-height":"var(--tw-leading, var(--text-base--line-height))","&::-webkit-scrollbar":{"width":"calc(0.25rem * 2)"}},".drawer-body:where(:last-child)":{"padding-bottom":"calc(0.25rem * 6)"},".drawer-footer":{"display":"flex","align-items":"center","justify-content":"flex-end","gap":"calc(0.25rem * 3)","padding":"calc(0.25rem * 6)"},".drawer-start":{"inset-inline-start":"calc(0.25rem * 0)","inset-inline-end":"auto","top":"calc(0.25rem * 0)","--tw-translate-x":"-100%","translate":"var(--tw-translate-x) var(--tw-translate-y)","transform":"var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y)","transition-property":"all","transition-timing-function":["var(--tw-ease, var(--default-transition-timing-function))","var(--ease-in-out)"],"transition-duration":["var(--tw-duration, var(--default-transition-duration))","300ms"],"--tw-duration":"300ms","--tw-ease":"var(--ease-in-out)","&:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *)":{"--tw-translate-x":"100%","translate":"var(--tw-translate-x) var(--tw-translate-y)"}},".drawer-end":{"inset-inline-start":"auto","inset-inline-end":"calc(0.25rem * 0)","top":"calc(0.25rem * 0)","--tw-translate-x":"100%","translate":"var(--tw-translate-x) var(--tw-translate-y)","transform":"var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y)","transition-property":"all","transition-timing-function":["var(--tw-ease, var(--default-transition-timing-function))","var(--ease-in-out)"],"transition-duration":["var(--tw-duration, var(--default-transition-duration))","300ms"],"--tw-duration":"300ms","--tw-ease":"var(--ease-in-out)","&:where(:dir(rtl), [dir=\"rtl\"], [dir=\"rtl\"] *)":{"--tw-translate-x":"-100%","translate":"var(--tw-translate-x) var(--tw-translate-y)"}},".drawer-top":{"inset-inline":"calc(0.25rem * 0)","top":"calc(0.25rem * 0)","max-height":"calc(0.25rem * 60)","max-width":"none","--tw-translate-y":"-100%","translate":"var(--tw-translate-x) var(--tw-translate-y)","transform":"var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y)","transition-property":"all","transition-timing-function":["var(--tw-ease, var(--default-transition-timing-function))","var(--ease-in-out)"],"transition-duration":["var(--tw-duration, var(--default-transition-duration))","300ms"],"--tw-duration":"300ms","--tw-ease":"var(--ease-in-out)"},".drawer-bottom":{"inset-inline":"calc(0.25rem * 0)","bottom":"calc(0.25rem * 0)","max-height":"calc(0.25rem * 60)","max-width":"none","--tw-translate-y":"100%","translate":"var(--tw-translate-x) var(--tw-translate-y)","transform":"var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z) var(--tw-skew-x) var(--tw-skew-y)","transition-property":"all","transition-timing-function":["var(--tw-ease, var(--default-transition-timing-function))","var(--ease-in-out)"],"transition-duration":["var(--tw-duration, var(--default-transition-duration))","300ms"],"--tw-duration":"300ms","--tw-ease":"var(--ease-in-out)"}};