mirrors/signal-desktop
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix Lightbox video controls in small viewports

Browse source
This commit is contained in:
ayumi-signal 2023-11-02 00:04:14 -07:00 committed by GitHub
parent bb89ff6d4e
commit b2d4e8cd56
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 12 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
stylesheets/components/Lightbox.scss
View file

@ -105,6 +105,12 @@
position: absolute; position: absolute;
top: 0; top: 0;
width: 100%; width: 100%;
// Prevent nav buttons from overlapping video controls in small viewports
@media (max-height: 500px) {
inset-inline-start: 40px;
width: calc(100% - 80px);
}
} }
height: auto; height: auto;
@ -192,12 +198,16 @@
--height: 224px; --height: 224px;
position: absolute; position: absolute;
top: calc(50% - var(--height) / 2); top: calc(50% - var(--height) / 2);
width: 25%;
max-width: 96px;
height: var(--height); height: var(--height);
// We need this so that the buttons stack above the container // We need this so that the buttons stack above the container
z-index: $z-index-above-base; z-index: $z-index-above-base;
// Added extended click zone only when it wouldn't overlap video controls
@media (min-height: 500px) {
width: 25%;
max-width: 96px;
}
} }
&__nav-next { &__nav-next {