relates #2234 follow up dark mode standardisation

Finish updating dark mode colours
Also make some general CSS changes
This commit is contained in:
HWFord 2025-01-28 16:28:57 +01:00
parent 1eb083bc63
commit b0905ac88c
10 changed files with 175 additions and 139 deletions

View file

@ -274,19 +274,6 @@ UL.thumbnails li.rank-of-image {background-color: #ddd;}
#pwgMain {padding-left:0}
.buttonLike:hover {color: #3C3C3C;}
.buttonLike, input[type="submit"], input[type="button"], input[type="reset"] {
background-color:#FFA646;
color:#3C3C3C;
}
.buttonLike:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover {
cursor: pointer;
background-color: #ff7700;
text-decoration: none;
}
.buttonLike i {
font-size:14px;
}
@ -583,6 +570,10 @@ input:focus + .slider {
background-color:#f9f9f9;
}
.UsernameBlock.success_message{
border:2px solid #c2f5c2;
}
.Tooltip p.TooltipText{
background-color:#f3f3f3;

View file

@ -50,7 +50,6 @@ or
}
.head-button-2:hover {
background: #eee;
text-decoration: none !important;
color: inherit !important;
}

View file

@ -920,7 +920,7 @@ $(".AddUserBlock button").on("click", function () {
dissociateUserInfo.fadeOut()
$(".UsernameBlock:first").css("margin-right", "0px").css("border", "2px solid #c2f5c2");
$(".UsernameBlock:first").addClass('success_message');
$(".UsernameBlock").slice(1).css("margin-right", "10px").css("border", "none");
associateUserInfo.remove()
associateUserInfo.insertAfter(userBlock);

View file

@ -46,7 +46,7 @@ var statGraph = new Chart(ctx, {
//Line options
var displayOptions = {
backgroundColor: gradient(255, 119, 0),
borderColor: 'rgba(255,119,0,1)',
borderColor: '#FFA646 ',
lineTension : 0.2
}

View file

@ -374,10 +374,6 @@ const all_related_categories_ids = {$all_selected_album|json_encode};
border: 1px solid #D3D3D3 !important;
} */
.breadcrumb-item.add-item.highlight{
color: #3C3C3C !important;
}
.breadcrumb-item{
margin: 5px 0 5px 0 !important;
}

View file

@ -1544,12 +1544,12 @@ $(document).ready(function() {
.user-container-initials-wrapper > span {
border-radius:50%;
padding:5px;
width:40px;
height:40px;
width:30px;
height:30px;
display:inline-block;
text-align:center;
font-size:1.5em;
line-height:1.9em;
margin-left:7px;
}
.user-container-status {
@ -3114,12 +3114,6 @@ Advanced filter
margin-bottom: 35px;
}
.compactView .user-container-initials-wrapper > span {
height: 40px;
width: 40px;
}
.compactView .user-container {
height: 50px;
padding: 0 50px 0 0;
@ -3155,8 +3149,8 @@ Advanced filter
position: absolute;
right: 0px;
height: 50px;
width: 50px;
height: 40px;
width: 40px;
border-radius: 50%;
display: flex;
@ -3291,7 +3285,7 @@ Advanced filter
justify-content: center;
font-size: 10px;
padding: 1px 6px;
padding: 2px 6px;
color: black;
margin:0 4px 0 7px;

View file

@ -987,7 +987,7 @@ background: #ffa646;
border-radius: 15px;
pointer-events: none;
padding: 0px 7px;
color: #333
color: #493C21;
}
.pagination-per-page {
@ -2710,9 +2710,10 @@ h2:lang(en) { text-transform:capitalize; }
padding: 2px 10px;
border-radius: 5px;
}
.pluginActionLevel1:hover {
background-color: #ff7700;
color: white;
color:#493C21;
text-decoration: none;
}
@ -5643,6 +5644,9 @@ input:checked + .slider:before, input:checked + .slider::after {
.jconfirm-buttons .btn {
text-transform: none !important;
}
.jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button{
border-radius:0!important;
}
/*Group checkbox*/
.Group-checkbox{
@ -5999,6 +6003,9 @@ input:checked + .slider:before, input:checked + .slider::after {
border-radius:25px;
}
.UsernameBlock.success_message{
margin-right:0px;
}
.UsersInGroupListContainer{
max-height:315px;
@ -6090,8 +6097,12 @@ input:checked + .slider:before, input:checked + .slider::after {
.LinkUserManager{
text-align:center;
padding:40px;
}
.LinkUserManager a{
font-weight:700;
padding-top:20px;
padding:13px 20px;
}
.AddUserSubmit:hover{
@ -6257,6 +6268,7 @@ a.group_users {
}
.see-out.disabled {
cursor: not-allowed;
opacity:1;
}
.see-out.disabled p {
background-color: #ECECEC;
@ -6347,7 +6359,18 @@ fieldset#environment legend i[class*="icon-"] {
}
.buttonLike, input[type="submit"], input[type="button"], input[type="reset"] {
font-size:12px; border:none; padding:13px 20px; margin-left:0; font-weight: bold; transition: all 125ms ease-out;
font-size:12px;
border:none;
padding:13px 20px;
margin-left:0; font-weight: bold; transition: all 125ms ease-out;
color:#493C21;
background-color:#FFA646;
}
.buttonLike:hover, input[type="submit"]:hover, input[type="button"]:hover, input[type="reset"]:hover {
cursor: pointer;
background-color: #ff7700;
text-decoration: none;
}
#cboxLoadedContent input[type="submit"] {margin-bottom: 20px; float: none;}
@ -6902,11 +6925,6 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
margin-bottom:20px;
}
.user-container.container-selected .user-container-initials-wrapper > span {
background-color: #FF7B00;
color:#FEE7BD;
}
.user-container.container-selected .user-groups,
.user-container.container-selected .registration-clock {
background-color: #FEE7C8;

View file

@ -41,10 +41,6 @@ or
box-shadow: 0px 2px #00000024;
}
.head-button-2:hover {
background: #eee;
}
/* -------------
Advanced filter
-------------

View file

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg width="100%" height="100%" viewBox="0 0 46 50" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;"><g id="layer1"><path id="path825" d="M37.232,0c-4.093,0.094 -4.714,1.991 -10.48,2.833l-14.667,-0c-1.587,-0 -3.158,0.318 -4.625,0.937c-1.466,0.619 -2.798,1.525 -3.92,2.669c-1.122,1.143 -2.013,2.5 -2.62,3.994c-0.607,1.493 -0.92,3.094 -0.92,4.711l0,21.842c0,3.265 1.274,6.396 3.54,8.704c2.266,2.309 5.34,3.606 8.545,3.606l21.442,-0c1.588,-0 3.159,-0.318 4.625,-0.937c1.467,-0.618 2.799,-1.525 3.921,-2.668c1.123,-1.144 2.013,-2.501 2.62,-3.994c0.608,-1.494 0.92,-3.094 0.92,-4.711l0,-28.924l-0.007,-0.016c-0.155,-4.481 -3.925,-8.045 -8.374,-8.045l-0,-0.001Zm0.165,5.383c1.565,-0 2.833,1.268 2.833,2.833c0,1.565 -1.268,2.833 -2.833,2.833c-1.565,-0 -2.833,-1.268 -2.833,-2.833c-0,-1.565 1.268,-2.833 2.833,-2.833Zm-18.929,5.667c0.171,-0.002 0.341,0.007 0.507,0.03l7.769,-0c0.68,-0 1.309,0.256 1.78,0.676c0.001,0.001 0.001,0.001 0.002,0.002l-0,-0.001c1.158,0.793 1.756,2.243 1.405,3.665l-3.555,14.397c-0.341,1.382 -1.487,2.376 -2.833,2.593c-0.058,0.019 -0.116,0.034 -0.174,0.05c-1.859,0.493 -3.78,-0.608 -4.277,-2.445l-3.956,-14.614l-0,-0c-0.496,-1.833 0.614,-3.742 2.47,-4.235c0.287,-0.076 0.577,-0.115 0.862,-0.118l0,-0Zm3.914,24.364c2.972,-0 5.383,2.41 5.383,5.383c-0,2.972 -2.411,5.383 -5.383,5.383c-2.973,-0 -5.383,-2.411 -5.383,-5.383c-0,-2.973 2.41,-5.383 5.383,-5.383Z" style="fill:#be4949;fill-rule:nonzero;"/></g></svg>

After

Width:  |  Height:  |  Size: 1.7 KiB

View file

@ -123,7 +123,7 @@ a.Piwigo:hover span.Piwigo {
*/
a { color:#777; }
a:hover, a:active { color: #f70; cursor: pointer; }
a:hover, a:active { color: #ffa646; cursor: pointer; }
ul.actions, .content form#waiting {text-align:center;}
#adminHome A, #menubar li A, #menubar dt {
@ -224,19 +224,6 @@ body .ui-resizable-autohide .ui-resizable-handle { display: none; } /* use 'body
#ui-datepicker-div .ui-datepicker-buttonpane .ui-state-error:hover { background: #7e3030;}
INPUT[type="text"].large { width: 317px; }
.buttonLike, input[type="button"], input[type="submit"], input[type="reset"] {
color: #3c3c3c;
background-color: #FFA646;
}
.buttonLike:hover, input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {
color:#000;
text-decoration: none;
background-color:#f70;
color:#000;
cursor:pointer;
}
.buttonLike:disabled, input[type="button"]:disabled, input[type="submit"]:disabled, input[type="reset"]:disabled {
color:#555;
border-color:#666;
@ -343,13 +330,13 @@ a.stat-box:hover {
* html .bigtext { margin-right: 300px; }
.themeBox {background-color:#333;}
.themeBox {background-color:#232323;}
.themeName {color:#ccc;}
.themeSelect {background-color: #333; box-shadow: none;}
.themeSelect.themeDefault {background-color: #f9bf80;}
.themeSelect.themeDefault a, .themeSelect.themeDefault span, .themeSelect.themeDefault .themeName{ color:#333;}
.themeActions A {border-bottom:none;}
.themeActions span {background-color: #888888;color: #666666;}
.themeActions span {background-color: #555555;color: #BBBBBB;}
.showInfo-dropdown-header a {color:#3A3A3A}
#pluginsMenuSeparator {border:1px solid #333;}
@ -363,7 +350,7 @@ a.stat-box:hover {
.pluginName {color:#aaa;}
.pluginBox.incompatible {border-color:#800 !important;}
.pluginActionLevel1 {color: #333;}
/* .pluginActionLevel1 {color: #333;} */
.pluginActionLevel2 {color: #bbbbbb;}
.pluginFilter {color: #c1c1c1;}
.pluginFilter input {border-color: #c1c1c1;}
@ -405,13 +392,13 @@ a.stat-box:hover {
}
#batchManagerGlobal #applyFilter {
color: #3C3C3C;
background-color: #ececec;
color: #BFBFBF;
background-color: #3c3c3c;
}
#batchManagerGlobal #applyFilter:hover {
color: white;
background-color: #ffc17e;
background-color: #1B1B1B;
cursor:pointer!important;
}
#batchManagerGlobal #filterList li {
@ -508,20 +495,19 @@ div.token-input-dropdown ul li.token-input-selected-dropdown-item {background-co
background-color: #1B1B1B ;
color: #777777;
}
.AddAlbumSubmit,
.AddAlbumSubmit{
color:#493C21;
background-color: #FFA646;
}
.RenameAlbumSubmit {
color: #3F3E40;
background-color: #FFA646;
}
.AddAlbumSubmit:hover,
.RenameAlbumSubmit:hover {
color: #3F3E40;
background-color: #f70;
}
.DeleteAlbumSubmit {
background-color: #e74c3c;
color: #fff;
}
/* Cat modify */
@ -697,8 +683,14 @@ label>p.group_select {
color:#ff7700;
}
.LinkUserManager{
color:#3c3c3c;
.LinkUserManager a{
background-color: #2E2E2E;
color:#777777;
}
.LinkUserManager a:hover{
background-color: #1B1B1B;
color:#777777;
}
/* Selection mode */
@ -707,12 +699,14 @@ label>p.group_select {
background-color: #333;
}
.slider:before {
background-color: #151515;
.slider::before,
.slider::after {
background-color: #777;
}
.slider::after {
color: #151515;
input:checked + .slider::before,
input:checked + .slider::after{
background-color:#333;
}
input:checked + .slider {
@ -829,7 +823,7 @@ input:focus + .slider {
.groups .manage-users:hover,
.groups .manage-permissions,
.groups .manage-permissions:hover{
color:#c0c0c0;
color:#777777;
}
.groups .manage-users:hover,
@ -856,6 +850,10 @@ input:focus + .slider {
color:#9e9e9e;
}
.UsernameBlock.success_message{
border:2px solid #AAF6E4;
}
.Tooltip p.TooltipText{
color:#f3f3f3;
@ -865,17 +863,17 @@ input:focus + .slider {
.ValidationUserAssociated, .ValidationUserDissociated{
background-color:#4EA590;
color: #AAF6E4;
color: #1B3A33;
}
.ValidationUserAssociated p, .ValidationUserDissociated p{
color:#c2f5c2 !important;
color:#1B3A33 !important;
}
.groups .showCreateGroup .icon-plus-circled,
#UserList .group-name-block span,
.groups .showCreateGroup .icon-plus-circled{
color:#A0C0F1;
color: #A0C0F1;
background-color: #4E71A5;
}
@ -908,8 +906,12 @@ input:focus + .slider {
background-color:#444 !important;
}
.AddUserSubmit, .update-user-button, .user-property-main-user-body .main-user-btn-validate{
color: #493C21!important;
background-color:#FFA646;
}
.AddUserSubmit:hover{
color: #3F3E40;
background-color: #f70;
}
@ -980,7 +982,7 @@ table.qsearch_help_table td {
.font-checkbox {color: #898888;}
.font-checkbox:hover {color: #ffa646;}
.font-checkbox:hover {color: #ededed;}
.with-border legend, .with-border strong {color: #c0c0c0;}
.font-checkbox.selected {color: #ffa646;}
@ -989,8 +991,8 @@ a#showPermissions {color: #D6D6D6; border: 1px solid #D6D6D6; background-color:
a#showPermissions:hover {border-color: #A5A5A5;}
.icon-plus.cboxElement {border: 1px solid #777; color: #c0c0c0;}
.icon-plus.cboxElement:hover {border: 1px solid #aaa;}
.selectize-control.single .selectize-input {border: 2px solid #FAC17E!important; color: #D5D5D5;}
.selectize-control.single .selectize-input:hover {border-color: #FFA646!important;}
.selectize-control.single .selectize-input {border: 2px solid #FFA646!important; color: #D5D5D5;}
.selectize-control.single .selectize-input:hover {border-color: #FF7700!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}
@ -1062,7 +1064,7 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.cat-modify-input-container #cat-parent {
background: #333333;
box-shadow: 0px 2px #00000024;
box-shadow: 0px 2px #0000007a!important;
}
.albumActions a:hover span {
@ -1137,15 +1139,6 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
#batchManagerGlobal .ui-slider .ui-slider-range {background-color: #aaaaaa;}
#batchManagerGlobal .ui-slider-range.ui-widget-header.ui-corner-all {border: 1px solid #ffaf58; background-color: #ffaf58;}
#batchManagerGlobal #applyFilter {
color: #BFBFBF;
background-color: #3c3c3c;
}
#batchManagerGlobal #applyFilter:hover {
background-color: #202020;
}
.selected-associate-item {
background-color: #333;
box-shadow: 0px 2px #000000AA;
@ -1187,6 +1180,15 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
border-left: 4px solid #b8feee;
}
.AddPluginSuccess label, .DeactivatePluginSuccess label, .RestorePluginSuccess label{
color: #b8feee;
background-color: #50a48f;
}
.AddPluginSuccess span, .RestorePluginSuccess span,.DeactivatePluginSuccess span {
color: #b8feee;
}
.infos li{
color: #ffffff;
}
@ -1255,6 +1257,29 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
background-color: #777 !important;
}
.jconfirm .jconfirm-box .jconfirm-buttons button.btn-red,
.DeleteAlbumSubmit{
background-color:#BE4949!important;
}
.jconfirm .jconfirm-box.jconfirm-type-red,
.DeleteAlbumPopInContainer{
border-top:7px solid #BE4949!important;
}
.jconfirm .jconfirm-box .jconfirm-buttons button.btn-red:hover,
.DeleteAlbumSubmit:hover{
background:#6C2D2D!important;
}
.jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button+button{
background-color: #2E2E2E;
color:#777777;
}
.jconfirm.jconfirm-modern .jconfirm-box .jconfirm-buttons button+button:hover{
background-color: #1B1B1B;
}
.jconfirm .jconfirm-box.loading::before {
background: #333 !important;
}
@ -1316,8 +1341,8 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
}
.info-warning {
color: #ffdd99;
background-color: #ee8800;
background-color: #d47f44;
color: #fedac0;
}
.info-warning a, .info-message a, .info-error a {
@ -1411,12 +1436,18 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.pluginActionLevel1,
.themeActions a:nth-child(1) {
background-color: #ffa744;
background-color: #FFA646;
}
.themeActions a:nth-child(2),
.plugin-inactive .pluginContent .pluginActionLevel1{
background-color:#999999;
background-color:#2E2E2E;
color:#777777;
}
.themeActions a:nth-child(2):hover{
background-color:#1B1B1B;
color:#777777;
}
.pluginContent {
@ -1495,12 +1526,12 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.pluginContainer.line .pluginBox:hover.plugin-inactive .slider {
transition: 0.4s;
background: #777777;
background: #444;
}
.pluginContainer .pluginBox.plugin-inactive .slider {
transition: 0.4s;
background: #777777;
background: #444;
}
.pluginContainer.line .pluginBox:hover .pluginContent .pluginActions a{
@ -1533,19 +1564,6 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
color: #111;
}
.AddPluginSuccess span,
.RestorePluginSuccess span,
.DeactivatePluginSuccess span {
color: #c2f5c2;
}
.AddPluginSuccess label,
.DeactivatePluginSuccess label,
.RestorePluginSuccess label {
color: #c2f5c2;
background-color: #0a0;
}
.PluginActionError span {
color: #ffd5dc
}
@ -1563,6 +1581,16 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
color: #999;
}
.plugin-version{
background-color:#FFA646;
color:#493C21;
}
.plugin-version-old{
background-color:#555;
color:#bbb;
}
.addAlbum label{
color:#aaa;
margin:-5px 0;
@ -1611,7 +1639,7 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.UserViewSelector input:checked + label .icon-th-large,
.UserViewSelector input:checked + label .icon-th-list,
.UserViewSelector input:checked + label .icon-pause {
color: #444;
color: #493C21;
}
.icon-th-large, .icon-th-list, .icon-pause {
@ -1628,6 +1656,7 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.head-button-2 {
background-color: #333 !important;
box-shadow:0px 2px #0000007a!important;
}
.head-button-2:hover {
@ -1640,12 +1669,12 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.user-first-col:hover {
box-sizing: border-box;
background-color:#ffa646;
background-color:transparent;
}
.user-first-col:hover .icon-pencil{
color:#FFA646;
}
.user-first-col:hover .icon-pencil {
color: #fedac0;
}
.user-first-col:hover .select-checkbox {
border: solid #ffa646 2px !important;
background-color: #ffa646 !important;
@ -1685,12 +1714,6 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
color: #777 !important;
}
.user-container.container-selected .user-container-initials-wrapper > span {
background-color: #c76a23;
color:#faa96b;
border: solid #c76a23 2px;
}
.user-container.container-selected .user-groups,
.user-container.container-selected .registration-clock {
background-color: #c76a23;
@ -1710,7 +1733,8 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
}
.advanced-filter-btn, .advanced-filter {
background-color:#333;
background-color:#2E2E2E;
color:#777;
}
.advanced-filter-item-label, .advanced-filter-title, .advanced-filter-close {
@ -1904,9 +1928,10 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
color: #bbbbbb;
}
/* Strange why this is different from light mode */
.compactView .user-container-initials-wrapper > span {
height: 50px !important;
width: 50px !important;
height: 40px !important;
width: 40px !important;
box-sizing: border-box;
}
@ -2029,17 +2054,17 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
.breadcrumb-item {
background-color: #333;
box-shadow: 0px 2px #000000AA;
box-shadow: 0px 2px #0000007a;
color: #777;
}
.breadcrumb-item:hover {
background: #ffc17e;
}
.breadcrumb-item:hover a,
.breadcrumb-item:hover span {
color: #000;
.breadcrumb-item:hover .link-path a{
color: #333333;
}
.breadcrumb-item .icon-cancel-circled:hover {
color: #ae5d1e;
}
@ -2092,6 +2117,10 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
text-decoration: none;
}
#start_unset:hover, #end_unset:hover{
color:#ffa646!important;
}
.hasDatepicker, .elem-type-select {
background: #252525 !important;
border-color: transparent !important;
@ -2117,17 +2146,21 @@ li.plupload_delete a:hover {background: url("images/cancelhover.svg")!important;
color: #bbb;
}
.breadcrumb-item.add-item:hover {
color:#777777;
background-color: #222222;
}
.breadcrumb-item.add-item.highlight {
background: #f7a43c;
box-shadow: 0 2px #af7200;
color: #444 !important;
color: #493C21 !important;
}
.breadcrumb-item.add-item:hover {
color: #000;
}
.add-item:hover{
background-color: #f70;
.breadcrumb-item.add-item.highlight:hover{
background-color: #FF7700;
}
.badge-dropdown {
background: #333;
}
@ -2328,3 +2361,11 @@ ul.jqtree-tree li.jqtree-ghost span.jqtree-line {
#whats_new button:hover{
background-color:#1B1B1B;
}
.filter-counter{
background-color:#ffa646!important;
}
.certification[data-certification="-1"] {
background-image: url("images/certification/CertificationWarningDM.svg")!important;
}