mirror of
https://github.com/Sped0n/bridget.git
synced 2026-04-14 10:09:31 -07:00
93629a4e6b
Replace text-align: right with display: flex, justify-content: flex-end for consistent right alignment. Add height, z-index for layering, and adjust margin/padding for better mobile gallery nav positioning. Signed-off-by: Sped0n <hi@sped0n.com>
86 lines
1.5 KiB
SCSS
86 lines
1.5 KiB
SCSS
.gallery {
|
|
pointer-events: all;
|
|
|
|
position: fixed;
|
|
top: var(--nav-height);
|
|
z-index: var(--z-nav-gallery);
|
|
overflow: hidden;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
|
|
width: 100vw;
|
|
height: calc(var(--window-height) - var(--nav-height));
|
|
background: white;
|
|
transform: translate3d(0, 100%, 0);
|
|
|
|
.galleryInner {
|
|
flex: 1;
|
|
height: 0;
|
|
}
|
|
|
|
.swiper-slide {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
img {
|
|
max-height: calc(var(--window-height) - 2 * var(--nav-height));
|
|
max-width: 100%;
|
|
width: auto;
|
|
object-fit: contain;
|
|
}
|
|
|
|
.loadingText {
|
|
position: absolute;
|
|
top: 50%;
|
|
left: 50%;
|
|
transform: translate3d(-50%, -50%, 0);
|
|
}
|
|
|
|
.slideContainer {
|
|
position: relative;
|
|
display: inline-block;
|
|
}
|
|
|
|
.nav {
|
|
height: var(--nav-height);
|
|
padding: var(--space-standard);
|
|
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.navClose {
|
|
cursor: pointer;
|
|
z-index: calc(var(--z-nav-gallery) + 1);
|
|
|
|
min-width: 25%;
|
|
height: calc(var(--nav-height) * 2.5);
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
|
|
margin-right: calc(var(--space-standard) * -1);
|
|
padding-right: var(--space-standard);
|
|
}
|
|
}
|
|
}
|
|
|
|
.curtain {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: var(--z-curtain);
|
|
|
|
width: 100vw;
|
|
height: var(--window-height);
|
|
|
|
background: rgba(0, 0, 0, 0.5);
|
|
opacity: 0;
|
|
|
|
pointer-events: none;
|
|
}
|