The_Great_Archive/cryptpad
1
0
Fork 0
mirror of https://github.com/cryptpad/cryptpad.git synced 2026-09-14 11:05:41 +05:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #1230 from cryptpad/1086-upload-progress-modal-overflows

Browse Source 
Make upload progress bar responsive
This commit is contained in:
David Benque 2023-09-29 16:00:27 +01:00 committed by GitHub
commit 7e478ed847
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
customize.dist/src/less2/include/fileupload.less
View File

@ -13,7 +13,7 @@
.modal_base();
position: absolute;
right: 10vw;
bottom: 10vh;
bottom: 100px;
border-radius: @variables_radius;
box-sizing: border-box;
z-index: 100001; //Z file upload table container: just above the file picker
@ -21,9 +21,9 @@
color: @cp_upload-fg;
max-height: 180px;
overflow-y: auto;
overflow-x: hidden;
@media screen and (max-width: @browser_media-medium-screen) {
left: 5vw; right: 5vw; bottom: 5vw;
left: 1vw; right: 1vw; bottom: 1vw;
}
.cp-fileupload-header {
@ -48,24 +48,32 @@
#cp-fileupload-table {
width: 100%;
@upload_pad_h: 0.25em;
@upload_pad_v: 0.5em;
@upload_pad_v: 0.25em;
td {
padding: @upload_pad_h @upload_pad_v;
white-space:nowrap;
}
.cp-fileupload-table-link {
display: flex;
align-items: center;
white-space: nowrap;
max-width: 30vw;
max-width: 40vw;
margin: 0px @upload_pad_v;
.fa {
margin-top: 4px;
margin-top: 4px;
margin-right: 5px;
}
.cp-fileupload-table-name {
overflow: hidden;
text-overflow: ellipsis;
min-width: 35vw;
@media screen and (max-width: 600px)
{
min-width:40vw;
}
}
&[href]:hover {
text-decoration: none;
@ -75,11 +83,11 @@
}
}
.cp-fileupload-table-progress {
min-width: 12em;
max-width: 16em;
position: relative;
text-align: center;
box-sizing: border-box;
min-width:20vw;
}
.cp-fileupload-table-progress-container {
position: relative;
@ -88,6 +96,7 @@
position: absolute;
width: 0px;
height: 100%;
padding:2px;
background-color: @cp_upload-progress;
z-index: -1; //Z file upload progress container
border-radius: @variables_radius;