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

Minor cross-theme visual tweakings.

This commit is contained in:
hackademix 2022-03-24 09:19:12 +01:00
parent 736548ca2f
commit 29c1480c05
3 changed files with 19 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/common/themes.css
View File

@ -34,9 +34,10 @@
--line-size: 1.7em;
--popup-size: 640px;
--bg-preset-color: var(--form-color2);
--bg-focused-row: linear-gradient(to bottom, var(--form-color1) 0, var(--form-color2) 70%, var(--bg-color1) 100%) no-repeat;
--bg-odd-row: var(--bg-color2);
--bg-even-row: var(--form-color1);
--bg-even-row: var(--tab-color1);
--border-row-sep: none;
}
@ -44,7 +45,7 @@
.__NoScript_Theme__.vintage {
--focus-color-light: #8cf8 !important;
--focus-color-dark: #0468 !important;
--focus-color-dark: #2488 !important;
--img-noscript-options: url(/img/vintage/noscript-options.png);
--img-ui-revoke-temp: url(/img/vintage/ui-revoke-temp64.png);
@ -72,13 +73,9 @@
--line-size: 1.5em;
--popup-size: 600px;
--bg-focused-row: var(--focus-color);
--bg-odd-row: var(--bg-color2);
--bg-even-row: var(--bg-color1);
--border-row-sep: none;
--bg-focused-row: linear-gradient(to bottom, transparent 0, transparent 60%, var(--focus-color) 100%);
}
.__NoScript_Theme__, .__NoScript_Theme__[data-theme="dark"] {
color-scheme: dark;
--accent-color: #d12027;
@ -90,7 +87,7 @@
--form-color1: #333;
--form-color2: #111;
--focus-color: var(--focus-color-dark);
--tab-color1: #6668;
--tab-color1: #334;
--tab-color2: #3348;
--form-check-color: var(--accent-color);
--form-control-color: var(--form-color2);
@ -112,7 +109,7 @@
--bg-color2: #fff;
--form-color1: #ccc;
--form-color2: #eee;
--tab-color1: #ddda;
--tab-color1: #ddd;
--tab-color2: #8888;
--focus-color: var(--focus-color-light);
}

2
src/ui/popup.css
View File

@ -241,7 +241,7 @@ html:not(.mobile) #scrollable {
}
#sites {
margin: 0.5em 0.25em;
margin: 0;
}
#content {

16
src/ui/ui.css
View File

@ -180,9 +180,12 @@ input[type="checkbox"] {
border-collapse: collapse;
border-spacing: 0;
width: 100%;
background-color: var(--bg-odd-row);
image-rendering: -webkit-optimize-contrast;
}
.vintage .sites {
image-rendering: auto;
}
.sites tr, .sites td {
margin: 0;
padding: 0;
@ -192,7 +195,7 @@ input[type="checkbox"] {
}
html:not(.mobile) .sites > tr.site:not(.customizing):is(:focus-within, :hover) {
background: var(--bg-focused-row);
background-image: var(--bg-focused-row);
border-color: transparent;
}
@ -201,10 +204,15 @@ html:not(.mobile) .sites > tr.site:not(.customizing):is(:focus-within, :hover) {
border-top: var(--border-row-sep);
}
.sites > tr.site:nth-child(even):not(.customizing) {
.sites > tr.site:nth-of-type(even):not(.customizing) {
background-color: var(--bg-even-row);
}
.sites > tr.site:nth-of-type(odd):not(.customizing) {
background-color: var(--bg-odd-row);
}
.sites > tr.site:first-of-type, tr.site:focus-within + tr, .sites > tr.customizing, .sites > tr.customizing + tr.site, .customizer, .customizer + tr.site {
border-color: transparent;
}
@ -364,7 +372,7 @@ span.preset {
}
:not(#presets) > .sites .site:not(.customizing) .presets input.preset:checked + label.preset {
background-image: linear-gradient(to right, transparent calc(var(--line-size) * 1.5), var(--form-color2) 50%);
background-image: linear-gradient(to right, transparent calc(var(--line-size) * 1.5), var(--bg-preset-color) 50%);
border-radius: calc(var(--line-size) / 2);
}