frutjam/dist/components/steps/object.js

A utility-first CSS UI Library for Tailwind CSS

export default {".step":{"--color-step":"var(--color-base-soft)","--color-on-step":"var(--color-on-base)","--color-step-active":"var(--color-primary)","--color-on-step-active":"var(--color-on-primary)","--step--size":"2rem","--step--font-size":"0.875rem","display":"grid","grid-template-columns":"auto","grid-template-rows":"auto 1fr","place-items":"center","text-align":"center","min-width":"4rem","counter-increment":"step","&::before":{"content":"\"\"","display":"block","height":"2px","width":"100%","background-color":"var(--color-step)","grid-column":"1","grid-row":"1","margin-inline":"-50%","z-index":0,"transition":"background-color 200ms ease-in-out"},"&::after":{"content":"counter(step)","display":"flex","align-items":"center","justify-content":"center","width":"var(--step--size)","height":"var(--step--size)","border-radius":"9999px","background-color":"var(--color-step)","color":"var(--color-on-step)","font-size":"0.75rem","font-weight":600,"z-index":1,"position":"relative","grid-column":"1","grid-row":"1","transition":"background-color 200ms ease-in-out, color 200ms ease-in-out"},"& > span, &:not(:empty)":{"font-size":"var(--step--font-size)","margin-block-start":"0.5rem","color":"currentColor","@supports (color: color-mix(in lab, red, red))":{"color":"color-mix(in oklch, currentColor 70%, transparent)"},"grid-row":"2"}},".steps":{"display":"inline-grid","grid-auto-columns":"1fr","grid-auto-flow":"column","overflow":"hidden","overflow-x":"auto","counter-reset":"step","list-style":"none","padding":"0","margin":"0"},".steps-horizontal":{"grid-auto-flow":"column","grid-auto-rows":"unset","grid-auto-columns":"1fr"},".steps-vertical":{"grid-auto-flow":"row","grid-auto-columns":"unset","grid-auto-rows":"auto"},".step-accent":{"--color-step":"var(--color-accent)","--color-on-step":"var(--color-on-accent)","&::after":{"background-color":"var(--color-accent)","color":"var(--color-on-accent)"},"&::before":{"background-color":"var(--color-accent)"}},".step-error":{"--color-step":"var(--color-error)","--color-on-step":"var(--color-on-error)","&::after":{"background-color":"var(--color-error)","color":"var(--color-on-error)"},"&::before":{"background-color":"var(--color-error)"}},".step-info":{"--color-step":"var(--color-info)","--color-on-step":"var(--color-on-info)","&::after":{"background-color":"var(--color-info)","color":"var(--color-on-info)"},"&::before":{"background-color":"var(--color-info)"}},".step-neutral":{"--color-step":"var(--color-neutral)","--color-on-step":"var(--color-on-neutral)","&::after":{"background-color":"var(--color-neutral)","color":"var(--color-on-neutral)"},"&::before":{"background-color":"var(--color-neutral)"}},".step-primary":{"--color-step":"var(--color-primary)","--color-on-step":"var(--color-on-primary)","&::after":{"background-color":"var(--color-primary)","color":"var(--color-on-primary)"},"&::before":{"background-color":"var(--color-primary)"}},".step-secondary":{"--color-step":"var(--color-secondary)","--color-on-step":"var(--color-on-secondary)","&::after":{"background-color":"var(--color-secondary)","color":"var(--color-on-secondary)"},"&::before":{"background-color":"var(--color-secondary)"}},".step-success":{"--color-step":"var(--color-success)","--color-on-step":"var(--color-on-success)","&::after":{"background-color":"var(--color-success)","color":"var(--color-on-success)"},"&::before":{"background-color":"var(--color-success)"}},".step-warning":{"--color-step":"var(--color-warning)","--color-on-step":"var(--color-on-warning)","&::after":{"background-color":"var(--color-warning)","color":"var(--color-on-warning)"},"&::before":{"background-color":"var(--color-warning)"}}};