Mirrors
/
uBlock
mirror of https://github.com/gorhill/uBlock.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Fine tune lightness (Luv) of rule colors in light theme 

Trying to use same Luv for both light and dark theme does not
really work -- best to have each them have their own Luv for
rule colors.
This commit is contained in:
Raymond Hill 2022-01-30 19:39:18 -05:00
parent c5c4c955df
commit f8c6be868c
No known key found for this signature in database
GPG Key ID: 25E1490B761470C2
2 changed files with 8 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/css/dashboard.css
View File

@ -34,7 +34,7 @@ html, body {
outline: 0; outline: 0;
} }
.tabButton.selected { .tabButton.selected {
background-color: var(--primary-surface-2); background-color: var(--dashboard-tab-active-surface);
border-bottom: 3px solid var(--dashboard-tab-active-ink); border-bottom: 3px solid var(--dashboard-tab-active-ink);
color: var(--dashboard-tab-active-ink); color: var(--dashboard-tab-active-ink);
fill: var(--dashboard-tab-active-ink); fill: var(--dashboard-tab-active-ink);

17
src/css/themes/default.css
View File

@ -224,8 +224,6 @@
--surface-3: rgb(var(--gray-80)); --surface-3: rgb(var(--gray-80));
--surface-4: rgb(var(--gray-75)); --surface-4: rgb(var(--gray-75));
--primary-surface-2: rgb(var(--primary-color-70) / 15%);
--border-1: rgb(var(--gray-75)); --border-1: rgb(var(--gray-75));
--border-2: rgb(var(--gray-70)); --border-2: rgb(var(--gray-70));
--border-3: rgb(var(--gray-65)); --border-3: rgb(var(--gray-65));
@ -258,13 +256,9 @@
--notice-surface: var(--accent-surface-1); --notice-surface: var(--accent-surface-1);
--notice-surface-shadow: #000 0 2px 8px; --notice-surface-shadow: #000 0 2px 8px;
--dashboard-bar-shadow:
0px 0px 0px 1px rgb(var(--ink-rgb) / 4%),
0px 1px 2px 0px rgb(var(--ink-rgb) / 4%),
0px 2px 1px -1px rgb(var(--ink-rgb) / 12%),
0px 1px 6px 0px rgb(var(--ink-rgb) / 12%);
--dashboard-tab-ink: var(--ink-1); --dashboard-tab-ink: var(--ink-1);
--dashboard-tab-active-ink: var(--accent-surface-1); --dashboard-tab-active-ink: var(--accent-surface-1);
--dashboard-tab-active-surface: rgb(var(--primary-color-70) / 10%);
--dashboard-tab-surface-hover: var(--surface-2); --dashboard-tab-surface-hover: var(--surface-2);
--dashboard-tab-border-hover: var(--surface-3); --dashboard-tab-border-hover: var(--surface-3);
@ -282,13 +276,13 @@
--popup-cell-surface: var(--surface-2); --popup-cell-surface: var(--surface-2);
--popup-cell-label-filter: opacity(40%); --popup-cell-label-filter: opacity(40%);
--popup-cell-cname-ink: rgb(var(--blue-50)); --popup-cell-cname-ink: rgb(var(--blue-50));
--popup-cell-allow-surface-rgb: 0 153 0; --popup-cell-allow-surface-rgb: 0 125 0; /* h:127.7 S:100 Luv:45 */
--popup-cell-noop-surface-rgb: 107 107 107; /* h:0 S:0 Luv:45 */
--popup-cell-block-surface-rgb: 216 0 0; /* h:12.2 S:100 Luv:45 */
--popup-cell-allow-own-surface: rgb(var(--popup-cell-allow-surface-rgb)); --popup-cell-allow-own-surface: rgb(var(--popup-cell-allow-surface-rgb));
--popup-cell-allow-surface: rgb(var(--popup-cell-allow-surface-rgb) / 35%); --popup-cell-allow-surface: rgb(var(--popup-cell-allow-surface-rgb) / 35%);
--popup-cell-noop-surface-rgb: 132 132 132;
--popup-cell-noop-own-surface: rgb(var(--popup-cell-noop-surface-rgb)); --popup-cell-noop-own-surface: rgb(var(--popup-cell-noop-surface-rgb));
--popup-cell-noop-surface: rgb(var(--popup-cell-noop-surface-rgb) / 35%); --popup-cell-noop-surface: rgb(var(--popup-cell-noop-surface-rgb) / 35%);
--popup-cell-block-surface-rgb: 255 40 40;
--popup-cell-block-own-surface: rgb(var(--popup-cell-block-surface-rgb)); --popup-cell-block-own-surface: rgb(var(--popup-cell-block-surface-rgb));
--popup-cell-block-surface: rgb(var(--popup-cell-block-surface-rgb) / 35%); --popup-cell-block-surface: rgb(var(--popup-cell-block-surface-rgb) / 35%);
--popup-cell-label-mixed-surface: #c29100; --popup-cell-label-mixed-surface: #c29100;
@ -410,6 +404,9 @@
/* popup panel */ /* popup panel */
--popup-cell-label-filter: opacity(40%); --popup-cell-label-filter: opacity(40%);
--popup-cell-cname-ink: hsla(0, 0%, 53%, 0.3); --popup-cell-cname-ink: hsla(0, 0%, 53%, 0.3);
--popup-cell-allow-surface-rgb: 0 153 0; /* h:127.7 S:100 Luv:55 */
--popup-cell-noop-surface-rgb: 132 132 132; /* h:0 S:0 Luv:55 */
--popup-cell-block-surface-rgb: 255 40 40; /* h:12.2 S:100 Luv:55 */
--popup-cell-allow-surface: rgb(var(--popup-cell-allow-surface-rgb) / 65%); --popup-cell-allow-surface: rgb(var(--popup-cell-allow-surface-rgb) / 65%);
--popup-cell-noop-surface: rgb(var(--popup-cell-noop-surface-rgb) / 65%); --popup-cell-noop-surface: rgb(var(--popup-cell-noop-surface-rgb) / 65%);
--popup-cell-block-surface: rgb(var(--popup-cell-block-surface-rgb) / 65%); --popup-cell-block-surface: rgb(var(--popup-cell-block-surface-rgb) / 65%);