maz-ui/dist/assets/MazInput.BSmkNTOh.css

A standalone components library for Vue.Js 3 & Nuxt.Js 3

.m-input[data-v-7034f80b]{vertical-align:top;flex-direction:column;align-items:flex-start;display:inline-flex}.m-input.--block[data-v-7034f80b]{width:100%}.m-input-top-label[data-v-7034f80b]{--maz-tw-text-opacity:1;color:hsl(var(--maz-foreground)/var(--maz-tw-text-opacity,1));margin-bottom:.5rem}.m-input-bottom-text[data-v-7034f80b]{margin-top:.25rem;font-size:.875rem;line-height:1.25rem}.m-input-wrapper[data-v-7034f80b]{z-index:1;--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background)/var(--maz-tw-bg-opacity,1));flex:1;width:100%;height:100%;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.m-input-wrapper.--border[data-v-7034f80b]{border-width:var(--maz-border-width);border-style:solid}.m-input-wrapper.--block[data-v-7034f80b]{width:100%}.m-input-wrapper.--default-border[data-v-7034f80b]{--maz-tw-border-opacity:1;border-color:hsl(var(--maz-border)/var(--maz-tw-border-opacity,1))}.m-input-wrapper.--default-border[data-v-7034f80b]:is([class~=dark] *){--maz-tw-border-opacity:1;border-color:hsl(var(--maz-border-400)/var(--maz-tw-border-opacity,1))}.m-input-wrapper-input[data-v-7034f80b]{flex:1;align-items:center;width:100%;max-width:100%;display:flex;position:relative}.m-input-wrapper-input.--has-left-icon .m-input-input[data-v-7034f80b]{padding-inline-start:.5rem}.m-input-wrapper-input.--has-left-icon .m-input-label[data-v-7034f80b]{left:.5rem}.m-input-wrapper-input.--has-right-icon .m-input-input[data-v-7034f80b]{padding-inline-end:.5rem}.m-input-wrapper-input.--xl[data-v-7034f80b]{height:calc(4rem - (var(--maz-border-width)*2))}.m-input-wrapper-input.--xl .m-input-input[data-v-7034f80b],.m-input-wrapper-input.--xl .m-input-label[data-v-7034f80b]{font-size:1.25rem;line-height:1.75rem}.m-input-wrapper-input.--lg[data-v-7034f80b]{height:calc(3.5rem - (var(--maz-border-width)*2))}.m-input-wrapper-input.--lg .m-input-input[data-v-7034f80b],.m-input-wrapper-input.--lg .m-input-label[data-v-7034f80b]{font-size:1.125rem;line-height:1.75rem}.m-input-wrapper-input.--md[data-v-7034f80b]{height:calc(3rem - (var(--maz-border-width)*2))}.m-input-wrapper-input.--sm[data-v-7034f80b]{height:calc(2.5rem - (var(--maz-border-width)*2))}.m-input-wrapper-input.--sm .m-input-input[data-v-7034f80b],.m-input-wrapper-input.--sm .m-input-label[data-v-7034f80b]{font-size:.875rem;line-height:1.25rem}.m-input-wrapper-input.--xs[data-v-7034f80b]{height:calc(2rem - (var(--maz-border-width)*2))}.m-input-wrapper-input.--xs .m-input-input[data-v-7034f80b],.m-input-wrapper-input.--xs .m-input-label[data-v-7034f80b]{font-size:.75rem;line-height:1rem}.m-input-wrapper-input.--mini[data-v-7034f80b]{height:calc(1.5rem - (var(--maz-border-width)*2))}.m-input-wrapper-input.--mini .m-input-input[data-v-7034f80b],.m-input-wrapper-input.--mini .m-input-label[data-v-7034f80b]{font-size:.75rem;line-height:1rem}.m-input-wrapper-right[data-v-7034f80b],.m-input-wrapper-left[data-v-7034f80b]{z-index:1;display:flex;position:relative}.m-input-wrapper-right[data-v-7034f80b]>:not([hidden])~:not([hidden]),.m-input-wrapper-left[data-v-7034f80b]>:not([hidden])~:not([hidden]){--maz-tw-space-x-reverse:0;margin-right:calc(.25rem*var(--maz-tw-space-x-reverse));margin-left:calc(.25rem*calc(1 - var(--maz-tw-space-x-reverse)))}.m-input-wrapper-right[data-v-7034f80b],.m-input-wrapper-left[data-v-7034f80b]{justify-content:center;align-items:center;padding-top:.25rem;padding-bottom:.25rem}.m-input-wrapper-right[data-v-7034f80b]{padding-inline-end:.5rem}.m-input-wrapper-left[data-v-7034f80b]{padding-inline-start:.5rem}.m-input-wrapper.--rounded-sm[data-v-7034f80b]{border-radius:calc(var(--maz-radius) - 8px)}.m-input-wrapper.--rounded-md[data-v-7034f80b]{border-radius:calc(var(--maz-radius) - 4px)}.m-input-wrapper.--rounded-lg[data-v-7034f80b]{border-radius:var(--maz-radius)}.m-input-wrapper.--rounded-xl[data-v-7034f80b]{border-radius:calc(var(--maz-radius) + 8px)}.m-input-wrapper.--rounded-full[data-v-7034f80b]{border-radius:9999px}.m-input-input[data-v-7034f80b]{appearance:none;text-overflow:ellipsis;white-space:nowrap;--maz-tw-text-opacity:1;width:100%;height:100%;color:hsl(var(--maz-foreground)/var(--maz-tw-text-opacity,1));--maz-tw-shadow:0 0 #0000;--maz-tw-shadow-colored:0 0 #0000;box-shadow:var(--maz-tw-ring-offset-shadow,0 0 #0000),var(--maz-tw-ring-shadow,0 0 #0000),var(--maz-tw-shadow);outline-offset:2px;background-color:#0000;border-style:none;outline:2px solid #0000;margin:0;padding:0 1rem;transition:padding .2s cubic-bezier(0,0,.2,1);overflow:hidden}.m-input-input[data-v-7034f80b]::placeholder{--maz-tw-text-opacity:1;color:hsl(var(--maz-muted)/var(--maz-tw-text-opacity,1))}.m-input-label[data-v-7034f80b]{pointer-events:none;transform-origin:0 0;text-overflow:ellipsis;white-space:nowrap;text-align:start;align-items:center;width:calc(100% + 1.3rem);line-height:1.5rem;transition:transform .2s cubic-bezier(0,0,.2,1);position:absolute;left:1rem;overflow:hidden}.m-input:not(.--should-up) .m-input-label[data-v-7034f80b]{width:calc(100% - .75rem)}.m-input.--should-up .m-input-label[data-v-7034f80b]{transform:scale(.8)translateY(-.65em)}.m-input.--should-up .m-input-input[data-v-7034f80b]{padding-top:1rem}.m-input[data-v-7034f80b]:not(.--has-state){--maz-tw-text-opacity:1;color:hsl(var(--maz-muted)/var(--maz-tw-text-opacity,1))}.m-input.--has-z-2 .m-input-wrapper[data-v-7034f80b]{z-index:2}.m-input.--is-readonly .m-input-input[data-v-7034f80b]{cursor:default}.m-input .m-input-wrapper[data-v-7034f80b]:is([class~=dark] *){--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-400)/var(--maz-tw-bg-opacity,1))}.m-input:has(input:disabled) .m-input-wrapper[data-v-7034f80b]{--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-600)/var(--maz-tw-bg-opacity,1));--maz-tw-text-opacity:1;color:hsl(var(--maz-muted)/var(--maz-tw-text-opacity,1))}.m-input:has(input:disabled) .m-input-wrapper[data-v-7034f80b]:is([class~=dark] *){--maz-tw-bg-opacity:1;background-color:hsl(var(--maz-background-300)/var(--maz-tw-bg-opacity,1))}.m-input:has(input:disabled) .m-input-input[data-v-7034f80b]{cursor:not-allowed;--maz-tw-text-opacity:1;color:hsl(var(--maz-muted)/var(--maz-tw-text-opacity,1))}.m-input.--is-focused .m-input-wrapper[data-v-7034f80b]{z-index:3}.m-input.--has-label .m-input-label[data-v-7034f80b]{padding-inline-end:.75rem}