Maximize space on small screens #1086

This commit is contained in:
DianaXWiki 2023-09-08 13:13:24 +03:00
parent 0ec5889b25
commit 6a3e58986b
1 changed files with 15 additions and 9 deletions

View File

@ -21,9 +21,9 @@
color: @cp_upload-fg; color: @cp_upload-fg;
max-height: 180px; max-height: 180px;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden;
@media screen and (max-width: @browser_media-medium-screen) { @media screen and (max-width: @browser_media-medium-screen) {
left: 5vw; right: 5vw; bottom: 5vw; left: 1vw; right: 1vw; bottom: 5vw;
} }
.cp-fileupload-header { .cp-fileupload-header {
@ -48,16 +48,17 @@
#cp-fileupload-table { #cp-fileupload-table {
width: 100%; width: 100%;
@upload_pad_h: 0.25em; @upload_pad_h: 0.25em;
@upload_pad_v: 0.5em; @upload_pad_v: 0.25em;
td { td {
padding: @upload_pad_h @upload_pad_v; padding: @upload_pad_h @upload_pad_v;
white-space:nowrap;
} }
.cp-fileupload-table-link { .cp-fileupload-table-link {
display: flex; display: flex;
align-items: center; align-items: center;
white-space: nowrap; white-space: nowrap;
max-width: 30vw; max-width: 40vw;
margin: 0px @upload_pad_v; margin: 0px @upload_pad_v;
.fa { .fa {
margin-top: 4px; margin-top: 4px;
@ -66,6 +67,13 @@
.cp-fileupload-table-name { .cp-fileupload-table-name {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
min-width: 35vw;
@media screen and (max-width: 600px)
{
min-width:40vw;
}
} }
&[href]:hover { &[href]:hover {
text-decoration: none; text-decoration: none;
@ -75,16 +83,14 @@
} }
} }
.cp-fileupload-table-progress { .cp-fileupload-table-progress {
min-width: 20vw;//12em;
max-width: 60vw ;//16em;
font-size:90%;
position: relative; position: relative;
text-align: center; text-align: center;
box-sizing: border-box; box-sizing: border-box;
min-width:20vw;
} }
.cp-fileupload-table-progress-container { .cp-fileupload-table-progress-container {
position: relative; position: relative;
max-width: 60vw;
} }
.cp-fileupload-table-progressbar { .cp-fileupload-table-progressbar {
position: absolute; position: absolute;