1
0
Fork 0
forked from Mirrors/gomuks
nyxmuks/web/src/ui/modal/Lightbox.css

64 lines
976 B
CSS

div.overlay {
position: fixed;
inset: 0;
display: flex;
align-items: center;
justify-content: center;
&.dimmed {
background-color: var(--dimmed-overlay-background-color);
}
&.modal > div.modal-box {
background-color: var(--background-color);
border-radius: 1rem;
padding: 1rem;
max-width: min(80rem, 80vw);
max-height: min(80rem, 80vh);
overflow: hidden;
display: flex;
&.full-screen-mobile {
@media screen and (max-width: 30rem) {
max-width: 100%;
max-height: 100%;
width: 100%;
height: 100%;
border-radius: 0;
}
}
> div.modal-box-inner {
overflow: scroll;
}
}
}
div.lightbox {
> div.controls {
position: fixed;
top: .5rem;
right: .5rem;
display: flex;
z-index: 1;
> button, > a {
color: var(--lightbox-button-color);
width: 3rem;
height: 3rem;
> svg {
width: 2rem;
height: 2rem;
}
}
}
> img {
max-width: 75%;
max-height: 75%;
transition: rotate 0.2s;
}
}