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

Adds some padding around lightbox zooming

Browse source
This commit is contained in:
Josh Perez 2021-10-05 13:28:32 -04:00 • committed by GitHub
parent 3eff5b73d2
commit bcf1640587
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
stylesheets/components/Lightbox.scss
View file

@ -13,6 +13,10 @@
right: 0;
top: 0;
z-index: 10;
&--zoom {
padding: 0;
}
}
&__main-container {
@ -75,7 +79,7 @@
&__shadow-container {
display: flex;
height: 100%;
padding: 0 16px;
padding: 0;
position: absolute;
width: 100%;
visibility: hidden;
@ -107,22 +111,22 @@
&__shadow-container &__object {
max-height: 200%;
max-width: 200%;
padding: 0;
padding: 10%;
visibility: hidden;
}
&__object--container--zoom &__object {
max-height: 200%;
max-width: 200%;
padding: 10%;
}
&__object--container--fill &__object {
height: 100%;
padding: 0;
width: 100%;
}
&__object--container--zoom &__object {
max-height: 200%;
max-width: 200%;
padding: 0;
}
&__unsupported {
@include button-reset;
flex-grow: 1;

4
ts/components/Lightbox.tsx
View file

@ -489,7 +489,9 @@ export function Lightbox({
return root
? createPortal(
<div
className="Lightbox Lightbox__container"
className={classNames('Lightbox Lightbox__container', {
'Lightbox__container--zoom': zoomType === ZoomType.ZoomAndPan,
})}
onClick={(event: React.MouseEvent<HTMLDivElement>) => {
event.stopPropagation();
event.preventDefault();