UNPKG

maz-ui

Version:

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

2 lines (1 loc) 3.27 kB
html.--m-fullscreen-open{height:100vh;overflow:hidden}.m-fullscreen-img[data-v-3fb56303]{z-index:1050;background-color:hsl(var(--maz-overlay)/.05);outline-offset:2px;--maz-tw-backdrop-blur:blur(8px);width:100vw;height:100vh;-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);outline:2px solid #0000;align-items:center;position:fixed;inset:0}.m-fullscreen-img .m-fullscreen-img-scroller[data-v-3fb56303]{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;overflow:auto}.m-fullscreen-img img[data-v-3fb56303]{z-index:2;cursor:zoom-in;-o-object-fit:contain;object-fit:contain;-o-object-position:center;object-position:center;outline-offset:2px;outline:2px solid #0000}.m-fullscreen-img img.--is-zoomed[data-v-3fb56303]{cursor:zoom-out}.m-fullscreen-img img.--invisible[data-v-3fb56303]{visibility:hidden}.m-fullscreen-img img.--absolute[data-v-3fb56303]{position:absolute}.m-fullscreen-img .m-fullscreen-img-loader[data-v-3fb56303]{z-index:15;font-size:1.5rem;line-height:2rem;position:absolute}.m-fullscreen-img .m-fullscreen-btn[data-v-3fb56303]{z-index:15;cursor:pointer;width:7%;min-width:5em;height:5rem;padding:1rem;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;position:absolute}.m-fullscreen-img .m-fullscreen-btn svg[data-v-3fb56303]{font-size:1.875rem;line-height:2.25rem;transition-property:transform;transition-duration:.3s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.m-fullscreen-img .m-fullscreen-btn:hover svg[data-v-3fb56303]{--maz-tw-scale-x:1.5;--maz-tw-scale-y:1.5;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-fullscreen-img .m-fullscreen-btn.--close[data-v-3fb56303]{justify-content:flex-end;align-items:flex-start;top:0;right:0}.m-fullscreen-img .m-fullscreen-btn.--previous[data-v-3fb56303]{--maz-tw-translate-y:-50%;height:100vh;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));justify-content:flex-start;align-items:center;top:50%;left:0}.m-fullscreen-img .m-fullscreen-btn.--next[data-v-3fb56303]{--maz-tw-translate-y:-50%;height:100vh;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));justify-content:flex-end;align-items:center;top:50%;right:0}