issue #1019 photo upload redesign, minor changes

This commit is contained in:
Yann Le Boudec
2019-05-22 15:42:55 +02:00
committed by Pierrick Le Gall
parent 9891c79f25
commit 079b6fcb9a
4 changed files with 23 additions and 12 deletions
+3 -1
View File
@@ -411,7 +411,8 @@ a#showPermissions:hover {border-color: #A5A5A5;}
p#uploadWarningsSummary {color:#3C3C3C;}
.selectize-control.single .selectize-input {border: 2px solid #FFA646!important; color: #3C3C3C;}
.selectize-control.single .selectize-input:hover {border-color: #FAC17E!important;}
.plupload_filelist {scrollbar-color: #CBCBCB #F5F5F5!important;}
.plupload_filelist {scrollbar-color: #CBCBCB #ffffff!important; background-color: #ffffff!important;}
.plupload_filelist_footer {background-color: #F5F5F5!important;}
li.plupload_delete a {background: url("images/cancel.svg")!important; background-size: cover!important;}
li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important; background-size: cover!important;}
@@ -421,5 +422,6 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
#addAlbumForm input[name="category_name"] {border:none!important; margin-top: 5px!important;}
#addAlbumForm input[name="category_name"]:focus {background-color: #DDDDDD;}
.buttonSeparator {color: #3C3C3C;}
#uploadForm li.plupload_droptext {background-color: #F5F5F5!important;}
/* beta-test ends */
@@ -128,6 +128,11 @@ jQuery(document).ready(function(){
// update custom button state on queue change
QueueChanged : function(up) {
jQuery('#startUpload').prop('disabled', up.files.length == 0);
if (up.files.length > 0) {
jQuery('.plupload_filelist_footer').show();
jQuery('.plupload_filelist').css("overflow-y", "scroll");
}
},
UploadProgress: function(up, file) {
@@ -245,7 +250,7 @@ jQuery(document).ready(function(){
<div class="infos" style="display:none"><i class="eiw-icon icon-ok"></i></div>
<div class="errors" style="display:none"><i class="eiw-icon icon-cancel"></i><ul></ul></div>
<p class="afterUploadActions" style="margin:10px; display:none;"><a class="batchLink"></a> | <a href="admin.php?page=photos_add">{'Add another set of photos'|@translate}</a></p>
<p class="afterUploadActions" style="margin:10px; display:none;"> <a class="batchLink icon-pencil"></a><span class="buttonSeparator"> OU </span><a href="admin.php?page=photos_add" class="icon-plus-circled">{'Add another set of photos'|@translate}</a></p>
{if count($setup_errors) > 0}
<div class="errors">
@@ -300,7 +305,7 @@ jQuery(document).ready(function(){
<fieldset class="selectFiles" style="display:none">
<legend>{'Select files'|@translate}</legend>
<div class="selectFilesButtonBlock">
<button id="addFiles" class="buttonLike">{'Add Photos'|translate}<i class="icon-download"></i></button>
<button id="addFiles" class="buttonLike">{'Add Photos'|translate}<i class="icon-plus-circled"></i></button>
<div class="selectFilesinfo">
{if isset($original_resize_maxheight)}
<p class="uploadInfo">{'The picture dimensions will be reduced to %dx%d pixels.'|@translate:$original_resize_maxwidth:$original_resize_maxheight}</p>
+9 -6
View File
@@ -1223,7 +1223,7 @@ LEGEND {
/* Upload Form */
.plupload_header {display:none;}
#uploadForm .plupload_container {padding:0}
#uploadForm .plupload_scroll .plupload_filelist {height:250px;}
#uploadForm .plupload_scroll .plupload_filelist {height:250px; overflow-y: hidden;}
#uploadForm li.plupload_droptext {line-height:230px;font-size:2em;}
#uploadBoxes .file {margin-bottom:5px;text-align:left;}
@@ -1375,7 +1375,7 @@ FORM#categoryOrdering p.albumActions .userSeparator {margin:0 5px;}
.showCreateAlbum .userSeparator {margin:0 5px;}
#addAlbumOpen, #autoOrderOpen {padding: 7px 15px; font-weight: bold; font-size: 11px;}
.afterUploadActions {text-align: center; margin-bottom: 30px !important;}
.afterUploadActions a {justify-content: center; margin: 35px; font-weight: bold; font-size: 14px; padding: 10px 20px;}
.afterUploadActions a {justify-content: center; margin: 35px; font-weight: bold; font-size: 14px; padding: 10px 12px;}
#addAlbumOpen::before ,#autoOrderOpen::before {margin-right: 10px; font-weight: bold; font-size: 15px;}
#autoOrder p, #createAlbum p {text-align:left; margin:0 0 1em 0;}
#autoOrder p.actionButtons, #createAlbum p.actionButtons {margin-bottom:0;}
@@ -1611,7 +1611,6 @@ fieldset#environment legend i[class*="icon-"] {
#albumSelection {margin-left: 25px;}
.selectize-control.single .selectize-input {border-radius: 0; font-weight: bold;font-size: 12px;}
.buttonLike {padding: 8px 10px; margin-left: 5px;}
.buttonLike i {font-size: 18px;}
.selectFilesButtonBlock {display: flex; margin-top: 10px;}
.selectFilesinfo {margin-top: 10px; margin-left: 15px;}
#uploader {margin-top: 25px; font-weight: bold !important;}
@@ -1619,7 +1618,7 @@ fieldset#environment legend i[class*="icon-"] {
.plupload_filelist {scrollbar-width: thin!important;}
.plupload_wrapper, .plupload_file_size {font-weight: bold;}
.plupload_filelist li {background: none!important; font-weight: bold;}
li.plupload_delete a {background: url("images/cancel.svg")!important; background-size: cover !important;}
li.plupload_delete a {background: url("images/cancel.svg")!important; background-size: cover !important; width: 10px; height: 10px; margin-top: 3px;}
li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important; background-size: cover !important;}
.plupload_file_status {margin-right: 45px;}
.plupload_file_size {margin-right: 25px;}
@@ -1631,7 +1630,7 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.addAlbumEmpty {text-align: center; margin-top: 10%;}
.addAlbumEmptyTitle {font-size: 35px; font-weight: bold;}
.addAlbumEmptyInfos {font-size: 14px; margin-bottom: 25px !important; margin-top: 5px !important;}
.addAlbumEmpty a{display: inline-block; padding: 10px 15px;}
.addAlbumEmpty a{display: inline-block; padding: 10px 15px; font-weight: bold; font-size: 14px;}
.addAlbumEmpty a:hover{text-decoration: none;}
.addAlbumEmpty a::first-letter {text-transform: capitalize;}
.addAlbumFormParent {display: none;}
@@ -1659,4 +1658,8 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
margin-top: 20px;
border-radius: 7px;
}
.selectedAlbum span.icon-sitemap::before {margin-right: 12px;}
.selectedAlbum span.icon-sitemap::before, .afterUploadActions a.batchLink.icon-pencil::before, .afterUploadActions a.icon-plus-circled::before {
margin-right: 12px;
}
#addFiles i::before {margin-left: 13px; font-size: 15px;}
.plupload_filelist_footer {display: none;}
+4 -3
View File
@@ -404,8 +404,8 @@ a#showPermissions:hover {border-color: #A5A5A5;}
p#uploadWarningsSummary {color:#999;}
.selectize-control.single .selectize-input {border: 2px solid #FAC17E!important; color: #D5D5D5;}
.selectize-control.single .selectize-input:hover {border-color: #FFA646!important;}
.plupload_filelist {background-color: #414141!important; scrollbar-color: #D6D6D6 #444444!important;}
.plupload_filelist li {border-bottom: 1px solid #707070!important; color: #A5A5A5!important;}
.plupload_filelist {background-color: #444444 !important; scrollbar-color: #555 #444444!important;}
.plupload_filelist li {border-bottom: 1px solid #343434 !important; color: #A5A5A5!important;}
.plupload_filelist_footer {background-color: #3c3939!important; border: 0!important; color: #A5A5A5!important}
li.plupload_delete a {background: url("images/cancel.svg")!important; background-size: cover!important;}
li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important; background-size: cover!important;}
@@ -416,4 +416,5 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.buttonSeparator {color: #c1c1c1;}
#cboxTitle {color: #7f7f7f !important;}
#addAlbumForm {color: #999;}
.selectedAlbum span {background-color: #555; color: #999;}
.selectedAlbum span {background-color: #555; color: #999;}
#uploadForm li.plupload_droptext {background-color: #343434!important; color: #777 !important;}