diff --git a/manage.html b/manage.html index 1c2b452b..6937341b 100644 --- a/manage.html +++ b/manage.html @@ -33,9 +33,10 @@
@@ -43,9 +44,10 @@
@@ -322,13 +324,14 @@ - - - + + + + @@ -363,9 +367,10 @@ - - - + + + + @@ -384,9 +389,10 @@ data-filter-hide=":not(.updatable):not(.update-done), .no-update:not(.update-problem), .updatable:not(.can-update):not(.update-problem):not(.update-done)"> - - - + + + + @@ -399,11 +405,11 @@
@@ -446,7 +452,6 @@ - @@ -520,10 +525,10 @@

diff --git a/manage/manage.css b/manage/manage.css index 631ae1d0..6dc8f158 100644 --- a/manage/manage.css +++ b/manage/manage.css @@ -12,13 +12,16 @@ --header-icon-color: #888; --header-icon-hover-color: hsla(180, 99%, 58%, 1); + --tools-bg-color: #ccc; + --entry-header-bg-color: #ddd; --entry-header-text-color: #111; - --checked-bg-color: hsla(180, 38%, 25%, 1); + --checked-count-bg-color: hsla(180, 100%, 20%, 1); + --checked-bg-color: hsla(180, 100%, 20%, 1); --checked-mark-color: #fff; --entry-icon-color: #666; - --entry-icon-hover-color: hsla(180, 38%, 25%, 1); + --entry-icon-hover-color: hsla(180, 100%, 20%, 1); --delete-icon-hover-color: #d40000; } @@ -425,14 +428,15 @@ a svg, .svg-icon.sort { } /* Checkbox */ -.checkmate input:checked + svg.checkbox { - background: var(--checked-bg-color); - border-radius: var(--entry-icon-size); +.checkmate input:checked + svg.checkbox .filled-circle { + fill: var(--checked-bg-color); + display: block; } .checkmate input[type="checkbox"], .checkmate input:checked + svg.checkbox .circle, .checkmate input:not(:checked) + svg .checkmark, +.checkmate input:not(:checked) + svg.checkbox .filled-circle, .checkmate input:not(:indeterminate) + svg .indeterminate { display: none; } @@ -642,7 +646,7 @@ details.applies-to-extra[open] { /* bulk actions */ #tools-wrapper { - background: #ddd; + background: var(--tools-bg-color); width: 100vw; position: fixed; top: var(--header-height); @@ -708,16 +712,10 @@ details.applies-to-extra[open] { display: none !important; } - -#filters-wrapper filter-selection { - display: flex; - align-items: center; -} - .active #filters-stats, #bulk-filter-count:not(:empty) { - background-color: darkcyan; - border-color: darkcyan; + background-color: var(--checked-count-bg-color); + border-color: var(--checked-count-bg-color); border-radius: 2px; color: white; font-size: 0.7rem;