maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
2 lines (1 loc) • 8.95 kB
CSS
.m-timeline[data-v-78e67b79]{align-items:stretch;display:flex}.m-timeline.--horizontal[data-v-78e67b79]{flex-direction:row;align-items:flex-start}.m-timeline.--horizontal .m-timeline-item[data-v-78e67b79]{flex:1;align-items:flex-start;display:flex}.m-timeline.--horizontal .m-timeline-item.--last[data-v-78e67b79]{flex:none}.m-timeline.--horizontal .m-timeline-step[data-v-78e67b79]{flex-direction:column;align-items:center;gap:.5rem;min-width:3.5rem;display:flex}.m-timeline.--horizontal .m-timeline-content[data-v-78e67b79]{text-align:center}.m-timeline.--horizontal .m-timeline-connector[data-v-78e67b79]{padding-top:var(--m-timeline-indicator-half);flex:1;align-items:center;display:flex}.m-timeline.--horizontal .m-timeline-connector-track[data-v-78e67b79]{width:100%;height:.125rem}.m-timeline.--horizontal .m-timeline-connector-fill[data-v-78e67b79]{width:0;height:100%}.m-timeline.--horizontal .m-timeline-connector.--completed .m-timeline-connector-fill[data-v-78e67b79]{width:100%}.m-timeline.--vertical[data-v-78e67b79]{flex-direction:column}.m-timeline.--vertical .m-timeline-item[data-v-78e67b79]{flex-direction:column;display:flex}.m-timeline.--vertical .m-timeline-step[data-v-78e67b79]{flex-direction:row;align-items:center;gap:.75rem;display:flex}.m-timeline.--vertical .m-timeline-content[data-v-78e67b79]{text-align:left}.m-timeline.--vertical .m-timeline-connector[data-v-78e67b79]{padding-top:.25rem;padding-bottom:.25rem;padding-left:var(--m-timeline-indicator-half);align-items:stretch;display:flex}.m-timeline.--vertical .m-timeline-connector-track[data-v-78e67b79]{--maz-tw-translate-x:1px;width:.125rem;height:100%;min-height:1.5rem;transform:translate(var(--maz-tw-translate-x), var(--maz-tw-translate-y)) rotate(var(--maz-tw-rotate)) skewX(var(--maz-tw-skew-x)) skewY(var(--maz-tw-skew-y)) scaleX(var(--maz-tw-scale-x)) scaleY(var(--maz-tw-scale-y))}.m-timeline.--vertical .m-timeline-connector-fill[data-v-78e67b79]{width:100%;height:0}.m-timeline.--vertical .m-timeline-connector.--completed .m-timeline-connector-fill[data-v-78e67b79]{height:100%}.m-timeline .m-timeline-indicator[data-v-78e67b79]{width:var(--m-timeline-indicator-size);height:var(--m-timeline-indicator-size);background-color:hsl(var(--maz-muted)/30%);color:hsl(var(--maz-muted));flex-shrink:0;justify-content:center;align-items:center;display:flex}.m-timeline .m-timeline-step.--active .m-timeline-indicator[data-v-78e67b79]{background-color:hsl(var(--m-timeline-bg));color:hsl(var(--m-timeline-fg))}.m-timeline .m-timeline-step.--completed .m-timeline-indicator[data-v-78e67b79]{background-color:hsl(var(--m-timeline-state-bg,var(--m-timeline-bg)));color:hsl(var(--m-timeline-state-fg,var(--m-timeline-fg)))}.m-timeline .m-timeline-step.--error .m-timeline-indicator[data-v-78e67b79],.m-timeline .m-timeline-step.--warning .m-timeline-indicator[data-v-78e67b79]{background-color:hsl(var(--m-timeline-state-bg));color:hsl(var(--m-timeline-state-fg))}.m-timeline .m-timeline-step.--disabled[data-v-78e67b79]{pointer-events:none;opacity:.4}.m-timeline .m-timeline-connector-track[data-v-78e67b79]{background-color:hsl(var(--maz-muted)/20%)}.m-timeline .m-timeline-connector-fill[data-v-78e67b79]{background-color:hsl(var(--m-timeline-bg))}.m-timeline .m-timeline-content[data-v-78e67b79]{flex-direction:column;gap:.125rem;display:flex}.m-timeline .m-timeline-title[data-v-78e67b79]{color:hsl(var(--maz-foreground));margin:0;font-weight:600;line-height:1.25}.m-timeline .m-timeline-subtitle[data-v-78e67b79]{color:hsl(var(--maz-muted));margin:0;line-height:1.375}.m-timeline .m-timeline-step-number[data-v-78e67b79]{font-weight:700;line-height:1;font-size:var(--m-timeline-number-size)}.m-timeline .m-timeline-step-icon[data-v-78e67b79],.m-timeline .m-timeline-check-icon[data-v-78e67b79]{width:var(--m-timeline-icon-size);height:var(--m-timeline-icon-size)}.m-timeline.--clickable .m-timeline-step[data-v-78e67b79]:not(.--disabled){cursor:pointer}.m-timeline.--clickable .m-timeline-step:not(.--disabled):hover .m-timeline-indicator[data-v-78e67b79]{--maz-tw-ring-offset-shadow:var(--maz-tw-ring-inset) 0 0 0 var(--maz-tw-ring-offset-width) var(--maz-tw-ring-offset-color);--maz-tw-ring-shadow:var(--maz-tw-ring-inset) 0 0 0 calc(2px + var(--maz-tw-ring-offset-width)) var(--maz-tw-ring-color);box-shadow:var(--maz-tw-ring-offset-shadow), var(--maz-tw-ring-shadow), var(--maz-tw-shadow,0 0 #0000);--maz-tw-ring-color:hsl(var(--m-timeline-color)/30%)}.m-timeline.--clickable .m-timeline-step:not(.--disabled):focus-visible .m-timeline-indicator[data-v-78e67b79]{outline-offset:2px;--maz-tw-ring-offset-shadow:var(--maz-tw-ring-inset) 0 0 0 var(--maz-tw-ring-offset-width) var(--maz-tw-ring-offset-color);--maz-tw-ring-shadow:var(--maz-tw-ring-inset) 0 0 0 calc(2px + var(--maz-tw-ring-offset-width)) var(--maz-tw-ring-color);box-shadow:var(--maz-tw-ring-offset-shadow), var(--maz-tw-ring-shadow), var(--maz-tw-shadow,0 0 #0000);--maz-tw-ring-color:hsl(var(--m-timeline-color));--maz-tw-ring-offset-width:2px;outline:2px solid #0000}.m-timeline.--animated .m-timeline-indicator[data-v-78e67b79]{transition-property:all;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.m-timeline.--animated .m-timeline-connector-fill[data-v-78e67b79]{transition-property:all;transition-duration:.5s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.m-timeline.--animated .m-timeline-step.--active .m-timeline-indicator[data-v-78e67b79]{animation:2s cubic-bezier(.4,0,.6,1) infinite m-timeline-pulse-78e67b79}.m-timeline.--mini[data-v-78e67b79]{--m-timeline-indicator-size:1.25rem;--m-timeline-indicator-half:.625rem;--m-timeline-icon-size:.625rem;--m-timeline-font-size:.625rem;--m-timeline-number-size:.5rem}.m-timeline.--mini .m-timeline-title[data-v-78e67b79]{font-size:.625rem}.m-timeline.--mini .m-timeline-subtitle[data-v-78e67b79]{font-size:.5rem}.m-timeline.--xs[data-v-78e67b79]{--m-timeline-indicator-size:1.5rem;--m-timeline-indicator-half:.75rem;--m-timeline-icon-size:.75rem;--m-timeline-font-size:.75rem;--m-timeline-number-size:.625rem}.m-timeline.--xs .m-timeline-title[data-v-78e67b79]{font-size:.75rem;line-height:1rem}.m-timeline.--xs .m-timeline-subtitle[data-v-78e67b79]{font-size:.625rem}.m-timeline.--sm[data-v-78e67b79]{--m-timeline-indicator-size:1.75rem;--m-timeline-indicator-half:.875rem;--m-timeline-icon-size:.875rem;--m-timeline-font-size:.75rem;--m-timeline-number-size:.625rem}.m-timeline.--sm .m-timeline-title[data-v-78e67b79]{font-size:.75rem;line-height:1rem}.m-timeline.--sm .m-timeline-subtitle[data-v-78e67b79]{font-size:.65rem}.m-timeline.--md[data-v-78e67b79]{--m-timeline-indicator-size:2rem;--m-timeline-indicator-half:1rem;--m-timeline-icon-size:1rem;--m-timeline-font-size:.875rem;--m-timeline-number-size:.75rem}.m-timeline.--md .m-timeline-title[data-v-78e67b79]{font-size:.875rem;line-height:1.25rem}.m-timeline.--md .m-timeline-subtitle[data-v-78e67b79]{font-size:.75rem;line-height:1rem}.m-timeline.--lg[data-v-78e67b79]{--m-timeline-indicator-size:2.5rem;--m-timeline-indicator-half:1.25rem;--m-timeline-icon-size:1.25rem;--m-timeline-font-size:1rem;--m-timeline-number-size:.875rem}.m-timeline.--lg .m-timeline-title[data-v-78e67b79]{font-size:1rem;line-height:1.5rem}.m-timeline.--lg .m-timeline-subtitle[data-v-78e67b79]{font-size:.875rem;line-height:1.25rem}.m-timeline.--xl[data-v-78e67b79]{--m-timeline-indicator-size:3rem;--m-timeline-indicator-half:1.5rem;--m-timeline-icon-size:1.5rem;--m-timeline-font-size:1.125rem;--m-timeline-number-size:1rem}.m-timeline.--xl .m-timeline-title[data-v-78e67b79]{font-size:1.125rem;line-height:1.75rem}.m-timeline.--xl .m-timeline-subtitle[data-v-78e67b79]{font-size:1rem;line-height:1.5rem}.m-timeline.--rounded-none .m-timeline-indicator[data-v-78e67b79]{border-radius:0}.m-timeline.--rounded-sm .m-timeline-indicator[data-v-78e67b79]{border-radius:calc(var(--maz-radius) - 8px)}.m-timeline.--rounded-md .m-timeline-indicator[data-v-78e67b79]{border-radius:calc(var(--maz-radius) - 4px)}.m-timeline.--rounded-base .m-timeline-indicator[data-v-78e67b79]{border-radius:var(--maz-radius)}.m-timeline.--rounded-lg .m-timeline-indicator[data-v-78e67b79]{border-radius:calc(var(--maz-radius) + 4px)}.m-timeline.--rounded-xl .m-timeline-indicator[data-v-78e67b79]{border-radius:calc(var(--maz-radius) + 8px)}.m-timeline.--rounded-2xl .m-timeline-indicator[data-v-78e67b79]{border-radius:1rem}.m-timeline.--rounded-3xl .m-timeline-indicator[data-v-78e67b79]{border-radius:1.5rem}.m-timeline.--rounded-full .m-timeline-indicator[data-v-78e67b79]{border-radius:9999px}@keyframes m-timeline-pulse-78e67b79{0%,to{box-shadow:0 0 0 0 hsl(var(--m-timeline-bg) / 40%)}50%{box-shadow:0 0 0 6px hsl(var(--m-timeline-bg) / 0%)}}@media (prefers-reduced-motion:reduce){.m-timeline.--animated .m-timeline-indicator[data-v-78e67b79],.m-timeline.--animated .m-timeline-connector-fill[data-v-78e67b79]{transition-property:none;animation:none}}