flyonui/components/avatar/object.js

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

export default {".avatar-group":{"display":"flex",":where(.avatar)":{"overflow":"hidden","border-radius":"calc(infinity * 1px)","border":"2px solid var(--color-base-100)"}},".avatar":{"position":"relative","display":"inline-flex","vertical-align":"middle","font-size":"var(--text-base)","line-height":"var(--tw-leading, var(--text-base--line-height))","& > div":{"display":"block","aspect-ratio":"1 / 1","overflow":"hidden"},"& > span":{"display":"block","aspect-ratio":"1 / 1","overflow":"hidden"}},":where(.avatar) img":{"height":"100%","width":"100%","object-fit":"cover"},".avatar-placeholder":{"& > div":{"display":"flex","align-items":"center","justify-content":"center"},"& > span":{"display":"flex","align-items":"center","justify-content":"center"}},".pull-up":{".avatar":{"transition-property":"all","transition-timing-function":["var(--tw-ease, var(--default-transition-timing-function))","var(--ease-in)"],"transition-duration":["var(--tw-duration, var(--default-transition-duration))","250ms"],"--tw-duration":"250ms","--tw-ease":"var(--ease-in)","&:hover":{"z-index":30,"--tw-translate-y":"calc(0.25rem * -1)","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)","border-radius":"calc(infinity * 1px)","--tw-shadow":"0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px 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)"}}},".avatar-online-top":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-success)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","top":"3%","right":"3%"}},".avatar-offline-top":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-base-200)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","top":"3%","right":"3%"}},".avatar-busy-top":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-error)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","top":"3%","right":"3%"}},".avatar-away-top":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-warning)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","top":"3%","right":"3%"}},".avatar-online-bottom":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-success)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","bottom":"3%","right":"3%"}},".avatar-offline-bottom":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-base-200)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","bottom":"3%","right":"3%"}},".avatar-busy-bottom":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-error)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","bottom":"3%","right":"3%"}},".avatar-away-bottom":{"&:before":{"content":"\"\"","position":"absolute","z-index":10,"display":"block","border-radius":"calc(infinity * 1px)","background-color":"var(--color-warning)","outline-style":["var(--tw-outline-style)","var(--tw-outline-style)"],"outline-width":["1px","2px"],"outline-color":"var(--color-base-100)","width":"20%","height":"20%","bottom":"3%","right":"3%"}}};