diff --git a/admin/tags.php b/admin/tags.php
index db90f6bcd..d218420aa 100644
--- a/admin/tags.php
+++ b/admin/tags.php
@@ -72,12 +72,13 @@ foreach ($orphan_tags as $tag)
if (count($orphan_tag_names) > 0)
{
$warning_tags = sprintf(
- l10n('You have %d orphan tags: %s.'),
+ l10n('You have %d orphan tags %s.'),
count($orphan_tag_names),
''
- .l10n('See details').''
+ .l10n('Review').''
);
}
diff --git a/admin/themes/default/js/group_list.js b/admin/themes/default/js/group_list.js
index d4021e51d..fd1e0ad68 100644
--- a/admin/themes/default/js/group_list.js
+++ b/admin/themes/default/js/group_list.js
@@ -11,6 +11,11 @@ $(".CloseGroupPopup").click(function () {
$(".Group_details-popup-container").hide();
});
+//Number On Badge
+function updateBadge() {
+ $('.badge-number').html($('.GroupContainer').length - 2) //Less the add group div and the template
+}
+
/*-------
Add User toggle and reduces height of user list when add user form is visible
-------*/
@@ -87,6 +92,7 @@ jQuery(document).ready(function () {
groupBox = createGroup(group)
groupBox.prependTo(".groups")
setupGroupBox(groupBox);
+ updateBadge();
} else {
$("#addGroupForm .groupError").html(str_name_taken);
$("#addGroupForm .groupError").fadeIn();
@@ -282,6 +288,7 @@ var deleteGroup = function (id) {
$(".DeleteGroupList div[data-id="+id+"]").remove()
$("#MergeOptionsChoices option[value="+ id +"]").remove()
}
+ updateBadge();
},
error: function (err) {
console.log(err);
@@ -429,6 +436,7 @@ var duplicateAction = function(id) {
let groupbox = createGroup(group)
groupbox.insertAfter($("#group-"+id));
setupGroupBox(groupbox);
+ updateBadge();
}
},
error: function (err) {
@@ -608,6 +616,7 @@ $('.ConfirmMergeButton').on("click", function() {
$("#group-"+dest_grp + " .group_number_users").html(
number + " " + ((number > 1)? str_members_default:str_member_default)
);
+ updateBadge();
}
})
};
@@ -659,6 +668,7 @@ $('.ConfirmDeleteButton').on("click", function() {
},
...jConfirm_alert_options
});
+ updateBadge();
}
},
error: function (err) {
diff --git a/admin/themes/default/js/tags.js b/admin/themes/default/js/tags.js
index 8b915c8a0..3d22e0228 100644
--- a/admin/themes/default/js/tags.js
+++ b/admin/themes/default/js/tags.js
@@ -30,6 +30,11 @@ $('.tag-warning p a').on('click', () => {
})
})
+//Number On Badge
+function updateBadge() {
+ $('.badge-number').html($('.tag-box').length)
+}
+
//Add a tag
$('.add-tag-container').on('click', function() {
$('#add-tag').addClass('input-mode');
@@ -87,6 +92,7 @@ function addTag(name) {
newTag = createTagBox(data.result.id, name);
$('.tag-container').prepend(newTag);
setupTagbox(newTag);
+ updateBadge()
resolve();
} else {
reject(str_already_exist.replace('%s', name));
@@ -231,6 +237,8 @@ function removeTag(id, name) {
if (data.stat === "ok") {
$('.tag-box[data-id='+id+']').remove();
}
+ updateBadge()
+ hideLastTags()
}
})
},
@@ -302,6 +310,8 @@ function duplicateTag(id, name) {
newTag.find('.tag-dropdown-action.manage').show();
}
setupTagbox(newTag);
+ updateBadge()
+ hideLastTags()
resolve(data);
}
},
@@ -505,8 +515,8 @@ function removeSelectedTags() {
url: "ws.php?format=json&method=pwg.tags.delete",
type: "POST",
data: {
- tag_id: ids,
- pwg_token: pwg_token
+ 'pwg_token': pwg_token,
+ 'tag_id': ids
},
success: function (raw_data) {
data = jQuery.parseJSON(raw_data);
@@ -515,6 +525,8 @@ function removeSelectedTags() {
$('.tag-box[data-id='+id+']').remove();
})
updateListItem();
+ updateBadge()
+ hideLastTags()
}
}
})
@@ -570,6 +582,8 @@ function mergeGroups(destination_id, merge_ids) {
}
$(".tag-box").attr("data-selected", '0');
updateListItem();
+ updateBadge()
+ hideLastTags()
}
}
})
diff --git a/admin/themes/default/template/group_list.tpl b/admin/themes/default/template/group_list.tpl
index 223b085e4..78db8f813 100644
--- a/admin/themes/default/template/group_list.tpl
+++ b/admin/themes/default/template/group_list.tpl
@@ -95,7 +95,7 @@ var rootUrl = '{$ROOT_URL}'
-
{'Group manager'|@translate}
+ {'Group management'|@translate} {count($groups)}
@@ -239,4 +239,4 @@ var rootUrl = '{$ROOT_URL}'
-
\ No newline at end of file
+
diff --git a/admin/themes/default/template/tags.tpl b/admin/themes/default/template/tags.tpl
index 1573cf538..5ea81023a 100644
--- a/admin/themes/default/template/tags.tpl
+++ b/admin/themes/default/template/tags.tpl
@@ -35,8 +35,8 @@ var str_others_tags_available = '{'%s other tags available...'|@translate}'
{'View in gallery'|@translate}
{'Manage photos'|@translate}
{'Edit'|@translate}
- {'Delete'|@translate}
{'Duplicate'|@translate}
+ {'Delete'|@translate}
@@ -53,7 +53,7 @@ var str_others_tags_available = '{'%s other tags available...'|@translate}'
{/function}
-
{'Manage tags'|@translate}
+ {'Tag Manager'|@translate} {count($all_tags)}
@@ -75,7 +75,7 @@ var str_others_tags_available = '{'%s other tags available...'|@translate}'
-
+
@@ -100,24 +100,26 @@ var str_others_tags_available = '{'%s other tags available...'|@translate}'
{if $warning_tags != ""}
-
+
{/if}
-
-
+
+
diff --git a/admin/themes/default/theme.css b/admin/themes/default/theme.css
index c403e130e..8f6f720c2 100644
--- a/admin/themes/default/theme.css
+++ b/admin/themes/default/theme.css
@@ -258,6 +258,10 @@ TABLE.doubleSelect SELECT.categoryList {
margin: 4px;
}
+.search-input:hover {
+ background-color: #f0f0f0 !important;
+}
+
.search-icon {
position: absolute;
top: 50%;
@@ -265,6 +269,18 @@ TABLE.doubleSelect SELECT.categoryList {
font-size: 18px;
}
+.badge-number {
+ padding: 3px 6px;
+ border-radius: 8px;
+ background-color: rgb(44,132,195);
+ color: #CDE9FD;
+ font-size: 12px;
+ margin-left: 10px;
+ font-weight: 700;
+ position: absolute;
+ transform: translateY(4px);
+}
+
.stat-legend-container {
display: inline-block;
}
@@ -3250,7 +3266,7 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.tag-header #search-tag{
position: absolute;
- right: 230px;
+ right: 240px;
}
.tag-header #add-tag {
@@ -3262,97 +3278,76 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
display: none;
}
-.tag-header #add-tag .add-tag-container {
+.tag-header #add-tag .add-tag-label {
position: relative;
padding: 10px;
background-color: #fafafa;
- padding-left: 30px;
box-shadow: 0px 2px #00000024;
border-radius: 5px;
font-weight: bold;
- display: inline-flex;
- transition: ease 0.2s;
+ display: flex;
+ align-items: baseline;
cursor: pointer;
}
-.tag-header #add-tag .add-tag-container:hover {
- background-color: #f0f0f0;
+.tag-header #add-tag.input-mode .add-tag-label {
+ background: none;
+ box-shadow: none;
+ cursor: auto;
+ padding: 5px 10px;
+}
+
+.tag-header #add-tag .add-tag-label::before {
+ margin: auto;
+ font-size: 16px;
+ margin-right: 5px;
+}
+
+.tag-header #add-tag.input-mode .add-tag-label::before {
+ display: none;
+}
+
+.tag-header #add-tag .add-tag-label p{
+ margin: 0;
+}
+
+.tag-header #add-tag .add-tag-container {
+ display: none;
}
.tag-header #add-tag.input-mode .add-tag-container {
- width: 200px;
- cursor: auto;
+ display: flex;
}
-.tag-header #add-tag input[type=text] {
- position: absolute;
- left: 5%;
- background: none;
- width: calc(90% - 40px);
+.tag-header #add-tag.input-mode .add-tag-container input {
+ padding: 5px;
border: none;
- opacity: 0;
+ margin-left: 10px;
+}
+
+.tag-header #add-tag span.icon-cancel{
display: none;
- transition: ease 0.2s;
-}
-
-.tag-header #add-tag span{
- z-index: 100;
- cursor: pointer;
-}
-
-.tag-header #add-tag.input-mode input[type=text] {
- opacity: 1;
- display: block;
-}
-
-.tag-header #add-tag .icon-validate {
position: absolute;
+ right: 0;
top: 50%;
- transform: translate(5px, -50%);
- font-size: 18px;
- position: absolute;
- left: 0;
- right: auto;
- transition: transform ease 0.8s, color ease 0.2s;
+ transform: translate(50%, -50%);
}
-.tag-header #add-tag.input-mode .icon-validate{
- transform: translate(180px, -50%) rotate(360deg);
- color: #FFA646;
- font-size: 22px;
+.tag-header #add-tag.input-mode span{
+ display: block;
+ margin: auto;
+ font-size: 20px;
cursor: pointer;
}
-.tag-header #add-tag.input-mode span:hover{
+.tag-header #add-tag span.icon-plus-circled {
+ color: #ffa744;
+}
+
+.tag-header #add-tag span:hover {
color: #ff7700;
}
-.tag-header #add-tag p {
- margin: 0;
- white-space: nowrap;
-}
-
-.tag-header #add-tag.input-mode p {
- opacity: 0;
-}
-
-.tag-header #add-tag .icon-cancel {
- position: absolute;
- top: 50%;
- transform: translate(209px, -50%);
- font-size: 18px;
- position: absolute;
- left: 0;
- transition: ease 0.2s;
- display: none;
- opacity: 0;
-}
-
-.tag-header #add-tag.input-mode .icon-cancel {
- display: block;
- opacity: 1;
-}
-
.tag-header .selection-controller {
display: none;
align-items: baseline;
@@ -3371,15 +3366,16 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.tag-header .selection-controller a {
margin: 0;
- background-color: #fafafa;
+ background-color: #f0f0f0;
padding: 10px;
- box-shadow: 0px 2px #00000024;
color: #777;
font-weight: bold;
+ margin: 4px;
+ border-radius: 5px;
}
.tag-header .selection-controller a:hover {
- background-color: #f0f0f0;
+ background-color: #ddd;
color: #3A3A3A;
text-decoration: none;
}
@@ -3390,11 +3386,15 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
overflow: hidden;
border-radius: 20px;
display: flex;
- padding: 0px 10px;
+ padding: 0px 10px 0px 0px;
font-weight: bold;
margin-left: 10px;
}
+.tag-info.hide {
+ display: none;
+}
+
.tag-info p {
margin: auto;
white-space: nowrap;
@@ -3430,6 +3430,10 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
animation-timing-function: ease;
}
+.tag-info a:hover {
+ color: white;
+}
+
@keyframes tag-error-appear {
25% { transform: translateX(-10px)}
50% { transform: translateX(10px)}
@@ -3448,21 +3452,22 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.tag-container .tag-box{
display: inline-flex;
align-items: center;
- padding: 10px;
+ padding: 5px 10px 5px 15px;
background-color: #fafafa;
- margin: 5px;
+ margin: 7px 5px;
box-shadow: 0px 2px 1px #00000024;
border-radius: 18px;
position: relative;
}
.tag-container.selection .tag-box {
- opacity: 0.6;
+ opacity: 0.8;
cursor: pointer;
}
-.tag-container .tag-box[data-selected='1'] {
+.tag-container.selection .tag-box[data-selected='1'] {
opacity: 1;
+ background-color: #ffd7ad;
}
.tag-container .tag-box p {
@@ -3470,6 +3475,10 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
margin: 0;
}
+.tag-container .tag-box[data-selected='1'] p {
+ color: #333;
+}
+
.tag-container .tag-box.edit-name p {
display: none;
}
@@ -3516,28 +3525,29 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.tag-container .tag-box .select-checkbox {
display: none;
- width: 18.4px;
- height: 19px;
- background-color: #e7e7e7;
+ width: 15px;
+ height: 15px;
border-radius: 100%;
margin: 2px 0px;
- margin-left: 0px;
- margin-left: 4px;
+ margin-left: 3.4px;
+ border: solid #ffa646 2px;
+}
+
+.tag-container .tag-box:hover .select-checkbox,
+.tag-container .tag-box[data-selected='1'] .select-checkbox {
+ background-color: #ffa646;
}
.tag-container .tag-box .select-checkbox.show {
display: block;
}
-.tag-container .tag-box[data-selected='1'] .select-checkbox {
- background-color: #ddd;
-}
-
.tag-container .tag-box .select-checkbox i {
display: none;
- font-size: 20px;
- transform: translate(-12px , -6px);
+ font-size: 14px;
+ transform: translate(-9px , -3px);
position: absolute;
+ color: #fafafa;
animation-name: icon-check-animation;
animation-duration: 0.4s;
animation-timing-function: ease-out;
@@ -3549,13 +3559,13 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
@keyframes icon-check-animation {
0% {
- transform: translate(-12px , -6px) scale(0);
+ transform: translate(-9px , -3px) scale(0);
}
75% {
- transform: translate(-12px , -6px) scale(1.3);
+ transform: translate(-9px , -3px) scale(1.3);
}
100% {
- transform: translate(-12px , -6px);
+ transform: translate(-9px , -3px);
}
}