Group manager color changes light and dark mode

Light mode and dark mode color change to group block when checked in selection mode, and to the group icon (changed to orange) number of members made orange.
Dark mode selection mode orange color made darker
Dark mode group name changes to black when checked, changes via jquery (BlackFont class added)
This commit is contained in:
Hannah
2020-04-22 15:16:51 +02:00
committed by plegall
parent c726a39cad
commit f8d2bbe200
3 changed files with 31 additions and 19 deletions
+5 -5
View File
@@ -500,13 +500,13 @@ input:focus + .slider {
background-color:#ffd7ad!important;
}
.GreyBackground{
background-color:#e7e7e7!important;
color:#a0a0a0!important;
.OrangeIcon{
background-color:#f98100!important;
color:#ffe4c7!important;
}
.GreyFont{
color:#a0a0a0!important;
.OrangeFont{
color:#ff7700!important;
}
/*Selection mode content*/
+8 -4
View File
@@ -132,11 +132,12 @@ $(function () {
$(".Group-checkbox").css('display','none');
$(".Group-checkbox-container input").prop("checked", false);
$('#group-1 li').removeClass("OrangeBackground");
$('.groups .icon-users-1:first-child').removeClass("GreyBackground");
$('.groups .icon-users-1:first-child').removeClass("OrangeIcon");
$(".GroupManagerButtons").removeClass("DisableInSelectionMode");
$("#group_name").attr('contenteditable', true);
$(".icon-pencil").removeClass("DisableInSelectionMode");
$("label").css("cursor","pointer")
$('.groups label').removeClass("BlackFont")
}
});
});
@@ -149,11 +150,14 @@ Change background color of group block if checked in selection mode
$(".Group-checkbox-container input[type='checkbox']").change(function(){
if($(this).is(":checked")){
$('#group-1 li').addClass("OrangeBackground");
$('.groups .icon-users-1:first-child').addClass("GreyBackground");
$('.groups .group_number_users').addClass("GreyFont");
$('.groups .icon-users-1:first-child').addClass("OrangeIcon");
$('.groups .group_number_users').addClass("OrangeFont");
$('.groups label').addClass("BlackFont")
}else{
$('#group-1 li').removeClass("OrangeBackground");
$('.groups .icon-users-1:first-child').removeClass("GreyBackground");
$('.groups .icon-users-1:first-child').removeClass("OrangeIcon");
$('.groups .group_number_users').removeClass("OrangeFont");
$('.groups label').removeClass("BlackFont")
} });
/*-------
+18 -10
View File
@@ -496,7 +496,7 @@ label>p.group_select {
}
input:checked + .slider {
background-color: #FFC27F;
background-color: #ff8c27;
}
input:focus + .slider {
@@ -509,16 +509,20 @@ input:focus + .slider {
}
.OrangeBackground{
background-color:#ffa744!important;
background-color:#f9852c!important;
}
.GreyBackground{
background-color:#e7e7e7!important;
color:#a0a0a0!important;
.OrangeIcon{
background-color:#ae5d1e !important;
color:#faa96b!important;
}
.GreyFont{
color:#3c3c3c!important;
.OrangeFont{
color:#fddaba!important;
}
.BlackFont{
color:black!important;
}
/*Selection mode content*/
@@ -576,17 +580,21 @@ input:focus + .slider {
/*Group checkbox*/
.groups .group-checkmark {
border:2px solid #ff7700;
border:2px solid #c76a23;
}
.groups .Group-checkbox-container:hover input ~ .group-checkmark {
background-color: #ff7700;
background-color: #c76a23;
}
.groups .Group-checkbox-container input:checked ~ .group-checkmark {
background-color: #ff7700;
background-color: #c76a23;
}
.groups .Group-checkbox-container .group-checkmark:after {
border: solid #ebebeb;
border-width: 0 3px 3px 0;
}
/*Group manager buttons*/