CodeCow/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2026-06-30 21:11:04 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

lightbox: Update styles with flexbox to avoid height calculation.

Browse Source 
Using flex-grow ensures that component fills up the available
space without the need of calculation of height.
This commit is contained in:
Sourabh Patel 2025-01-08 22:11:41 +05:30 committed by Tim Abbott
parent e963d5eaa9
commit fcaa77ffba
1 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
web/styles/lightbox.css
View File

@ -1,13 +1,16 @@
#lightbox_overlay {
background-color: hsl(227deg 40% 16%);
display: flex;
flex-direction: column;
height: 100dvh;
.image-preview {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
position: relative;
width: 100%;
height: calc(100% - 65px - 95px);
margin: 0;
overflow: hidden;
@ -32,9 +35,9 @@
}
.video-player {
flex: 1;
display: flex;
width: 100%;
height: calc(100% - 65px - 95px);
align-items: center;
justify-content: center;
margin: 0;
@ -151,7 +154,7 @@
}
.player-container {
height: calc(100% - 65px - 95px);
flex: 1;
display: flex;
text-align: center;
justify-content: center;