From 0ec5889b2584a7b0b3b2ab8e61c0ea605eb06727 Mon Sep 17 00:00:00 2001 From: DianaXWiki Date: Mon, 4 Sep 2023 11:16:32 +0300 Subject: [PATCH 1/6] Make upload progress bar responsive #1086 --- customize.dist/src/less2/include/fileupload.less | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index 9a1b0c3d2..74b592f1e 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -75,19 +75,22 @@ } } .cp-fileupload-table-progress { - min-width: 12em; - max-width: 16em; + min-width: 20vw;//12em; + max-width: 60vw ;//16em; + font-size:90%; position: relative; text-align: center; box-sizing: border-box; } .cp-fileupload-table-progress-container { position: relative; + max-width: 60vw; } .cp-fileupload-table-progressbar { 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; From 6a3e58986bfe5d82f69d3edaec307da521ab26d2 Mon Sep 17 00:00:00 2001 From: DianaXWiki Date: Fri, 8 Sep 2023 13:13:24 +0300 Subject: [PATCH 2/6] Maximize space on small screens #1086 --- .../src/less2/include/fileupload.less | 24 ++++++++++++------- 1 file changed, 15 insertions(+), 9 deletions(-) diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index 74b592f1e..5c69ab8bd 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -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: 5vw; } .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,16 +83,14 @@ } } .cp-fileupload-table-progress { - min-width: 20vw;//12em; - max-width: 60vw ;//16em; - font-size:90%; position: relative; text-align: center; box-sizing: border-box; + min-width:20vw; + } .cp-fileupload-table-progress-container { position: relative; - max-width: 60vw; } .cp-fileupload-table-progressbar { position: absolute; From 71dfbc14d3eb364ed2d9dce9d1b309df624d7663 Mon Sep 17 00:00:00 2001 From: DianaXWiki Date: Fri, 8 Sep 2023 16:30:22 +0300 Subject: [PATCH 3/6] Fix success upload message location #1086 --- customize.dist/src/less2/include/alertify.less | 18 ++++++++++++++---- .../src/less2/include/fileupload.less | 4 ++-- 2 files changed, 16 insertions(+), 6 deletions(-) diff --git a/customize.dist/src/less2/include/alertify.less b/customize.dist/src/less2/include/alertify.less index 8ad8c3b43..bf72279a2 100644 --- a/customize.dist/src/less2/include/alertify.less +++ b/customize.dist/src/less2/include/alertify.less @@ -44,6 +44,13 @@ } &.success { background: @cp_alertify-log-bg; + @media (max-width: 600px) + { + font-size: 1em; + max-height: 95px; + max-width: 100%; + } + } } } @@ -321,12 +328,11 @@ } .alertify-logs { - + max-width: 100%; position: fixed; - z-index: 100001; // alertify logs (just in front of alertify modals - + z-index: 100001; // alertify logs (just in front of alertify modals) &.bottom, &:not(.top) { - bottom: 16px; + bottom: 5px; /* // Bottom left placement. Default. Use for transitions. &.left, &:not(.right) { > * { @@ -356,6 +362,10 @@ left: -110%; } } + @media (max-width: 600px){ + left: 0px; + } + } &.right { diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index 5c69ab8bd..2f3fcc5d2 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -13,7 +13,7 @@ .modal_base(); position: absolute; right: 10vw; - bottom: 10vh; + bottom: 80px; border-radius: @variables_radius; box-sizing: border-box; z-index: 100001; //Z file upload table container: just above the file picker @@ -23,7 +23,7 @@ overflow-y: auto; overflow-x: hidden; @media screen and (max-width: @browser_media-medium-screen) { - left: 1vw; right: 1vw; bottom: 5vw; + left: 1vw; right: 1vw; bottom: 100px; } .cp-fileupload-header { From f02547851e6daf58c03df8e323fff3a6a6221d8d Mon Sep 17 00:00:00 2001 From: DianaXWiki Date: Fri, 15 Sep 2023 13:54:23 +0300 Subject: [PATCH 4/6] Revert "Fix success upload message location #1086" --- customize.dist/src/less2/include/alertify.less | 18 ++++-------------- .../src/less2/include/fileupload.less | 4 ++-- 2 files changed, 6 insertions(+), 16 deletions(-) diff --git a/customize.dist/src/less2/include/alertify.less b/customize.dist/src/less2/include/alertify.less index bf72279a2..8ad8c3b43 100644 --- a/customize.dist/src/less2/include/alertify.less +++ b/customize.dist/src/less2/include/alertify.less @@ -44,13 +44,6 @@ } &.success { background: @cp_alertify-log-bg; - @media (max-width: 600px) - { - font-size: 1em; - max-height: 95px; - max-width: 100%; - } - } } } @@ -328,11 +321,12 @@ } .alertify-logs { - max-width: 100%; + position: fixed; - z-index: 100001; // alertify logs (just in front of alertify modals) + z-index: 100001; // alertify logs (just in front of alertify modals + &.bottom, &:not(.top) { - bottom: 5px; + bottom: 16px; /* // Bottom left placement. Default. Use for transitions. &.left, &:not(.right) { > * { @@ -362,10 +356,6 @@ left: -110%; } } - @media (max-width: 600px){ - left: 0px; - } - } &.right { diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index 2f3fcc5d2..5c69ab8bd 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -13,7 +13,7 @@ .modal_base(); position: absolute; right: 10vw; - bottom: 80px; + bottom: 10vh; border-radius: @variables_radius; box-sizing: border-box; z-index: 100001; //Z file upload table container: just above the file picker @@ -23,7 +23,7 @@ overflow-y: auto; overflow-x: hidden; @media screen and (max-width: @browser_media-medium-screen) { - left: 1vw; right: 1vw; bottom: 100px; + left: 1vw; right: 1vw; bottom: 5vw; } .cp-fileupload-header { From 35d1209291f704b24adef1d674b9368c2ea9b35c Mon Sep 17 00:00:00 2001 From: DianaXWiki Date: Fri, 15 Sep 2023 15:00:13 +0300 Subject: [PATCH 5/6] Implement review changes #1086 --- customize.dist/src/less2/include/fileupload.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index 5c69ab8bd..cbd85e06f 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -13,7 +13,7 @@ .modal_base(); position: absolute; right: 10vw; - bottom: 10vh; + bottom: 1vh; border-radius: @variables_radius; box-sizing: border-box; z-index: 100001; //Z file upload table container: just above the file picker @@ -23,7 +23,7 @@ overflow-y: auto; overflow-x: hidden; @media screen and (max-width: @browser_media-medium-screen) { - left: 1vw; right: 1vw; bottom: 5vw; + left: 1vw; right: 1vw; bottom: 1vw; } .cp-fileupload-header { From c4de335ac386cac2179b46f7b1ca610e65883fd6 Mon Sep 17 00:00:00 2001 From: David Benque Date: Fri, 29 Sep 2023 15:59:51 +0100 Subject: [PATCH 6/6] Adjust position of upload modal on large screens - while we wait for a better sollution for altertify log position - give space under the upload modal for the log to be shown --- customize.dist/src/less2/include/fileupload.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/customize.dist/src/less2/include/fileupload.less b/customize.dist/src/less2/include/fileupload.less index cbd85e06f..d0db159b2 100644 --- a/customize.dist/src/less2/include/fileupload.less +++ b/customize.dist/src/less2/include/fileupload.less @@ -13,7 +13,7 @@ .modal_base(); position: absolute; right: 10vw; - bottom: 1vh; + bottom: 100px; border-radius: @variables_radius; box-sizing: border-box; z-index: 100001; //Z file upload table container: just above the file picker