maz-ui
Version:
A standalone components library for Vue.Js 3 & Nuxt.Js 3
2 lines (1 loc) • 6.28 kB
CSS
.m-dropzone[data-v-7a36205a]{cursor:pointer;border-radius:var(--maz-radius);border-width:var(--maz-border-width);--maz-tw-border-opacity:1;border-style:dashed;border-color:hsl(var(--maz-border) / var(--maz-tw-border-opacity,1));--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background) / var(--maz-tw-bg-opacity,1));flex-direction:column;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:1.5rem;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.2s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.m-dropzone[data-v-7a36205a]:hover{background-color:hsl(var(--maz-background-600) / .5)}.m-dropzone[data-v-7a36205a]:hover:is([class~=dark] *){background-color:hsl(var(--maz-background-400) / .5)}.m-dropzone--disabled[data-v-7a36205a]{cursor:not-allowed;opacity:.5}.m-dropzone--is-over-drop-zone[data-v-7a36205a]{background-color:hsl(var(--maz-primary-400) / .2)}.m-dropzone--is-over-drop-zone[data-v-7a36205a]:hover{--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-600) / var(--maz-tw-bg-opacity,1))}.m-dropzone--is-over-drop-zone[data-v-7a36205a]:hover:is([class~=dark] *){--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-400) / var(--maz-tw-bg-opacity,1))}.m-dropzone--is-over-drop-zone[data-v-7a36205a]{border-color:var(--active-color)}.m-dropzone--is-over-drop-zone .maz-dropzone__upload-icon[data-v-7a36205a]{color:var(--active-color)}.m-dropzone--is-over-error[data-v-7a36205a]{--maz-tw-border-opacity:1;border-color:hsl(var(--maz-destructive) / var(--maz-tw-border-opacity,1));--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-destructive-50) / var(--maz-tw-bg-opacity,1))}.m-dropzone--is-over-error[data-v-7a36205a]:hover{--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-destructive-50) / var(--maz-tw-bg-opacity,1))}.m-dropzone--is-over-error .maz-dropzone__upload-icon[data-v-7a36205a]{--maz-tw-text-opacity:1;color:hsl(var(--maz-destructive) / var(--maz-tw-text-opacity,1))}.m-dropzone__divider[data-v-7a36205a]{--maz-tw-text-opacity:1;color:hsl(var(--maz-muted) / var(--maz-tw-text-opacity,1));font-size:.875rem;line-height:1.25rem}.m-dropzone__content[data-v-7a36205a]{flex-direction:column;justify-content:center;align-items:center;gap:.25rem;display:flex}.m-dropzone__files-container[data-v-7a36205a]{flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;display:flex;position:relative}.m-dropzone__file-item[data-v-7a36205a]{cursor:auto;border-radius:var(--maz-radius);--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-600) / var(--maz-tw-bg-opacity,1));flex-direction:column;align-items:center;width:10rem;height:10rem;display:flex;position:relative;overflow:hidden}.m-dropzone__file-item[data-v-7a36205a]:is([class~=dark] *){--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-400) / var(--maz-tw-bg-opacity,1))}.m-dropzone__file-item[data-v-7a36205a]{transition:all .3s ease-in-out}.m-dropzone__thumbnail[data-v-7a36205a]{position:absolute;inset:0}.m-dropzone__overlay[data-v-7a36205a]{border-radius:var(--maz-radius);background-color:hsl(var(--maz-background) / .4);--maz-tw-backdrop-blur:blur(.125rem);-webkit-backdrop-filter:var(--maz-tw-backdrop-blur) var(--maz-tw-backdrop-brightness) var(--maz-tw-backdrop-contrast) var(--maz-tw-backdrop-grayscale) var(--maz-tw-backdrop-hue-rotate) var(--maz-tw-backdrop-invert) var(--maz-tw-backdrop-opacity) var(--maz-tw-backdrop-saturate) var(--maz-tw-backdrop-sepia);backdrop-filter:var(--maz-tw-backdrop-blur) var(--maz-tw-backdrop-brightness) var(--maz-tw-backdrop-contrast) var(--maz-tw-backdrop-grayscale) var(--maz-tw-backdrop-hue-rotate) var(--maz-tw-backdrop-invert) var(--maz-tw-backdrop-opacity) var(--maz-tw-backdrop-saturate) var(--maz-tw-backdrop-sepia);position:absolute;inset:0}.m-dropzone__icon-container[data-v-7a36205a]{z-index:2;flex:1;justify-content:center;align-items:center;padding:.5rem;display:flex}.m-dropzone__spinner[data-v-7a36205a]{font-size:1.125rem;line-height:1.75rem}.m-dropzone__success-icon[data-v-7a36205a]{--maz-tw-text-opacity:1;color:hsl(var(--maz-success) / var(--maz-tw-text-opacity,1));font-size:2.25rem;line-height:2.5rem}.m-dropzone__error-icon[data-v-7a36205a]{--maz-tw-text-opacity:1;color:hsl(var(--maz-destructive) / var(--maz-tw-text-opacity,1));font-size:2.25rem;line-height:2.5rem}.m-dropzone__file-icon-wrapper[data-v-7a36205a]{border-radius:var(--maz-radius);--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background) / var(--maz-tw-bg-opacity,1));--maz-tw-text-opacity:1;color:hsl(var(--maz-foreground) / var(--maz-tw-text-opacity,1));padding:.25rem}.m-dropzone__description[data-v-7a36205a]{z-index:2;text-overflow:ellipsis;white-space:nowrap;flex-direction:column;gap:.25rem;width:100%;padding:.5rem;display:flex;overflow:hidden}.m-dropzone__file-info[data-v-7a36205a]{text-align:center;flex-direction:column;gap:.125rem;font-size:.875rem;font-weight:600;line-height:1.25rem;display:flex}.m-dropzone__file-name[data-v-7a36205a],.m-dropzone__file-size[data-v-7a36205a]{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.m-dropzone__upload-icon[data-v-7a36205a]{font-size:1.875rem;line-height:2.25rem}.m-dropzone__upload-text[data-v-7a36205a]{text-align:center}.m-dropzone__info-text[data-v-7a36205a]{text-align:center;--maz-tw-text-opacity:1;max-width:100%;color:hsl(var(--maz-muted) / var(--maz-tw-text-opacity,1));flex-direction:column;margin-top:1rem;font-size:.875rem;line-height:1.25rem;display:flex}.m-dropzone__file-input[data-v-7a36205a]{display:none}.m-dropzone .icon-scale-enter-active[data-v-7a36205a],.m-dropzone .icon-scale-leave-active[data-v-7a36205a]{transition:transform .3s ease-in-out}.m-dropzone .icon-scale-enter-from[data-v-7a36205a]{opacity:0;position:absolute;transform:scale(0)}.m-dropzone .icon-scale-leave-to[data-v-7a36205a]{display:none}.m-dropzone .file-scale-enter-active[data-v-7a36205a],.m-dropzone .file-scale-leave-active[data-v-7a36205a]{transition:all .3s ease-in-out}.m-dropzone .file-scale-enter-from[data-v-7a36205a]{opacity:0;transform:scale(.3)}.m-dropzone .file-scale-leave-to[data-v-7a36205a]{opacity:0;transform:translateY(-100%)}.m-dropzone .file-scale-move[data-v-7a36205a]{transition:transform .3s ease-in-out}