diff options
Diffstat (limited to 'css/popup.css')
-rw-r--r-- | css/popup.css | 286 |
1 files changed, 143 insertions, 143 deletions
diff --git a/css/popup.css b/css/popup.css index a070e1d..9f466f2 100644 --- a/css/popup.css +++ b/css/popup.css @@ -1,7 +1,7 @@ /******************************************************************************* ηMatrix - a browser extension to black/white list requests. - Copyright (C) 2019-2020 Alessio Vanni + Copyright (C) 2019-2022 Alessio Vanni This program is free software: you can redistribute it and/or modify it under the terms of the GNU General Public License as published by @@ -16,7 +16,7 @@ You should have received a copy of the GNU General Public License along with this program. If not, see {http://www.gnu.org/licenses/}. - Home: https://libregit.spks.xyz/heckyel/ematrix + Home: https://gitlab.com/vannilla/ematrix uMatrix Home: https://github.com/gorhill/uMatrix */ @@ -33,19 +33,19 @@ body { overflow-y: auto; padding: 0; position: relative; -} + } *:focus { outline: none; -} + } a { color: inherit; text-decoration: none; -} + } #version { font-size: 10px; font-weight: normal; -} + } #gotoDashboard { background-color: #444; border: 0; @@ -58,17 +58,17 @@ a { padding: 3px 0; position: relative; text-align: center; -} + } #gotoDashboard > span:last-of-type { opacity: 0.5; position: absolute; -} + } body[dir="ltr"] #gotoDashboard > span:last-of-type { left: 3px; -} + } body[dir="rtl"] #gotoDashboard > span:last-of-type { right: 3px; -} + } .paneHead { background-color: white; @@ -78,10 +78,10 @@ body[dir="rtl"] #gotoDashboard > span:last-of-type { right: 0; top: 0; z-index: 100; -} + } .paneContent { padding-top: 5.5em; -} + } .paneHead > a:first-child { @@ -96,7 +96,7 @@ body[dir="rtl"] #gotoDashboard > span:last-of-type { margin: 0; padding: 2px 0; text-align: center; -} + } #toolbarContainer { display: flex; justify-content: space-between; @@ -106,7 +106,7 @@ body[dir="rtl"] #gotoDashboard > span:last-of-type { display: inline-flex; margin: 0; padding: 0; -} + } body .toolbar button { background-color: white; @@ -116,69 +116,69 @@ body .toolbar button { margin: 0; padding: 0.2em 0.2em 0.1em 0.2em; position: relative; -} + } body .toolbar button:hover { background-color: #eee; -} + } body .toolbar button.disabled { color: #ccc; -} + } body .toolbar button.fa { font: 1.7em FontAwesome; min-width: 1.4em; -} + } #mtxSwitch_matrix-off.switchTrue { color: #a00; -} + } #mtxSwitches > li { align-items: center; color: #888; display: flex; -} + } #mtxSwitches > li.switchTrue { color: #000; -} + } #mtxSwitches > li > svg { display: inline; height: 1em; margin-right: 0.4em; width: 1.5em; -} + } #mtxSwitches > li > svg * { fill-opacity: 1; opacity: 1; stroke: none; -} + } #mtxSwitches > li.relevant > svg .dot { fill: #aaa; -} + } #mtxSwitches > li.switchTrue.relevant > svg .dot { fill: #eee; -} + } #mtxSwitches > li > svg .off, #mtxSwitches > li.switchTrue > svg .on, #mtxSwitches > li.relevant > svg .dot { display: block; -} + } #mtxSwitches > li > svg .on, #mtxSwitches > li > svg .dot, #mtxSwitches > li.switchTrue > svg .off { display: none; -} + } #mtxSwitches > li > span[data-i18n] { flex-grow: 1; -} + } #mtxSwitches > li > a { color: #000; opacity: 0; -} + } #mtxSwitches > li:hover > a { opacity: 0.1; -} + } #mtxSwitches > li > a:hover { opacity: 0.8; -} + } .dropdown-menu-capture { background-color: transparent; @@ -192,10 +192,10 @@ body .toolbar button.fa { right: 0; top: 0; z-index: 300; -} + } .dropdown-menu-capture.show { display: block; -} + } .dropdown-menu { border: 0; display: inline-block; @@ -203,7 +203,7 @@ body .toolbar button.fa { padding: 3px 0 0 0; position: absolute; white-space: normal; -} + } .dropdown-menu > ul { margin: 0; border: 0; @@ -212,7 +212,7 @@ body .toolbar button.fa { padding: 0; background-color: white; list-style-type: none; -} + } .dropdown-menu > ul > li.dropdown-menu-entry { border: 0; color: black; @@ -220,21 +220,21 @@ body .toolbar button.fa { margin: 0; padding: 0.2em 0.25em; white-space: nowrap; -} + } .dropdown-menu > ul > li.dropdown-menu-entry:hover { background: #eee; -} + } .dropdown-menu > ul > li.dropdown-menu-entry-divider { border-top: 1px solid #ccc; margin: 0.5em 0; -} + } .dropdown-menu.show { display: block; -} + } #buttonReload { margin-left: 1em; -} + } button > span.badge { padding: 1px 1px; @@ -245,19 +245,19 @@ button > span.badge { bottom: 1px; color: #000; background-color: rgba(240,240,240,0.75) -} + } button.disabled > span.badge { display: none; -} + } #buttonPresets + .dropdown-menu { position: fixed; left: 10vw; width: 80vw; -} + } .presetInfo { margin: 0.25em 0.5em; text-align: center; -} + } .presetEntry { margin: 0.25em 0.25em; border-radius: 3px; @@ -265,14 +265,14 @@ button.disabled > span.badge { display: inline-block; cursor: pointer; background-color: #eee; -} + } .presetEntry .fa { margin-right: 0.25em; font-size: 110%; -} + } .presetEntry:hover { background-color: #80e2ff; -} + } #presetMore > *:first-child { margin: 0; padding: 0; @@ -280,19 +280,19 @@ button.disabled > span.badge { color: #888; cursor: pointer; font-size: 13px; -} + } #presetMore > *:first-child + div { margin: 0.25em 0 0 0; padding: 0.25em 0 0 0; display: none; text-align: center; -} + } #presetMore > *:first-child + div.show { display: block; -} + } #presetMore > *:first-child + div > * { vertical-align: middle; -} + } #presetMoreRecipe { border: 1px solid #aaa; width: 75%; @@ -301,20 +301,20 @@ button.disabled > span.badge { resize: none; font-size: 10px; color: #888; -} + } #presetMoreRecipe.bad { border: 1px solid #fcc; color: #aaa; -} + } #presetMoreWrite.bad { visibility: hidden; -} + } /* I think this is obsolete */ .dropdown-menu > li > a > i { padding: 0 6px; font-size: 1.2em; -} + } body .toolbar .scope { background-color: #ccc; @@ -326,75 +326,75 @@ body .toolbar .scope { margin: 0; padding: 1px; cursor: pointer; -} + } body .toolbar .scope > span { align-items: center; display: inline-flex; -} + } body .toolbar .scope > span > span { pointer-events: none; white-space: nowrap; -} + } body .toolbar #specificScope { direction: ltr; justify-content: flex-end; width: 16em; -} + } body .toolbar #specificScope.on { background-color: #24c; border-color: #24c; -} + } body .toolbar #specificScope > span { background-color: #ccc; justify-content: flex-end; -} + } body .toolbar #specificScope > span.on { background-color: #24c; -} + } body .toolbar #specificScope > span:first-of-type:not(.on):hover, body .toolbar #specificScope > span:first-of-type:not(.on):hover ~ span:not(.on), body .toolbar #specificScope > span:not(.on) + span:not(.on):hover, body .toolbar #specificScope > span:not(.on) + span:not(.on):hover ~ span:not(.on) { background-color: #999; -} + } body .toolbar #specificScope > span:first-of-type:not(.on):hover ~ span, body .toolbar #specificScope > span:not(.on) + span:not(.on):hover ~ span, body .toolbar #specificScope > span.on + span:hover, body .toolbar #specificScope > span.on + span:hover ~ span { background-color: #139; -} + } body .toolbar #specificScope > span:first-of-type { flex: 1; -} + } body .toolbar #globalScope { justify-content: center; margin-left: 1px; width: 1.8em; -} + } body .toolbar #globalScope.on { background-color: #000; border-color: #000; -} + } body .toolbar #globalScope:not(.on):hover { background-color: #999; border-color: #999; -} + } body .toolbar .scopeRel { color: #24c; -} + } body.globalScope .toolbar .scopeRel { color: #000; -} + } body.globalScope .toolbar .scopeRel.disabled { color: #ccc; -} + } .matrix { text-align: left; -} + } .matRow { white-space: nowrap; -} + } .matCell { margin: 1px 1px 0 0; border: 1px dotted rgba(0,0,0,0.2); @@ -407,23 +407,23 @@ body.globalScope .toolbar .scopeRel.disabled { text-align: center; line-height: 110%; position: relative; -} + } #matHead { border-top: 1px dotted #ccc; padding-top: 1px; margin: 1px 0 0 0; -} + } .paneHead .matCell:nth-child(2) { letter-spacing: -0.3px; -} + } .paneContent .matrix .matRow > .matCell:first-child { font-weight: 100; -} + } .paneContent .matrix .matRow > .matCell:first-child > b { font-weight: normal; -} + } /* RFC 3987 Internationalized Resource Identifiers (IRIs) -- 4.4 */ .matrix .matRow > .matCell:first-child { @@ -431,42 +431,42 @@ body.globalScope .toolbar .scopeRel.disabled { text-align: right; unicode-bidi: embed; width: 16em; -} + } .matrix .matGroup.g4 .matRow.ro > .matCell:first-child { direction: inherit; -} + } .matrix .matRow.l2 > .matCell:first-child { margin-left: 1px; width: calc(16em - 1px); -} + } .matrix .matRow > .matCell:hover { border-style: solid; -} + } .matrix .matGroup .matSection { margin: 2px 0 0 0; border: 0; padding: 0; /* background-color: rgba(0,0,0,0.05); */ -} + } .matrix .matGroup.g0 .matSection:first-child { margin-top: 0; -} + } .matrix .matGroup.g4 .matSection:first-child { margin-top: 0; -} + } /* Collapsing of domains */ .matrix .matSection .matRow.meta { display: none; -} + } .matrix .matSection.collapsible.collapsed .matRow.meta { display: block; -} + } .matrix .matSection.collapsible.collapsed .matRow.l1:not(.meta) { display: none; -} + } .matrix .matSection.collapsible.collapsed .matRow.l2.collapsible { display: none; -} + } /* Collapsing of blacklisted */ .matrix .g4Meta { @@ -475,106 +475,106 @@ body.globalScope .toolbar .scopeRel.disabled { border: 0; height: 6px; background: url('../img/matrix-group-hide.png') no-repeat center top, - url('../img/matrix-group-hline.png') repeat-x center top 3px; + url('../img/matrix-group-hline.png') repeat-x center top 3px; opacity: 0.2; cursor: pointer; -} + } .matrix .g4Meta:hover { opacity: 0.4; -} + } .matrix .g4Meta.g4Collapsed { background: url('../img/matrix-group-show.png') no-repeat center top, - url('../img/matrix-group-hline.png') repeat-x center top 3px; -} + url('../img/matrix-group-hline.png') repeat-x center top 3px; + } .matrix .g4Meta.g4Collapsed ~ .matSection { display: none; -} + } body.powerOff .matrix .g4Meta.g4Collapsed ~ .matSection { display: block; -} + } .matrix .g4Meta ~ .matRow.ro { display: none; -} + } .matrix .g4Meta.g4Collapsed ~ .matRow.ro { display: block; -} + } body.powerOff .matrix .g4Meta.g4Collapsed ~ .matRow.ro { display: none; -} + } .matrix .matGroup .g4Meta + *,.matrix .matGroup .g4Meta + * + * { margin-top: 0; padding-top: 0; -} + } /* Cell coloring */ .t81 { color: white; background-color: #c00; -} + } .t82 { color: white; background-color: #080; -} + } .t1 { border-color: #debaba; color: black; background-color: #f8d0d0; -} + } .t2 { border-color: #bad6ba; color: black; background-color: #d0f0d0; -} + } .matCell.p81 { background-image: url('../img/permanent-black-small.png'); background-repeat: no-repeat; background-position: -1px -1px; -} + } .matCell.p82 { background-image: url('../img/permanent-white-small.png'); background-repeat: no-repeat; background-position: -1px -1px; -} + } /* Cell coloring for color blind-friendly (hopefully) */ body.colorblind .t81 { color: white; background-color: rgb(0, 19, 110); -} + } body.colorblind .t82 { border-color: rgb(255, 194, 57); color: black; background-color: rgb(255, 194, 57); -} + } body.colorblind .t1 { border-color: rgba(0, 19, 110, 0.3); color: black; background-color: rgba(0, 19, 110, 0.2); -} + } body.colorblind .t2 { border-color: rgba(255, 194, 57, 0.3); color: black; background-color: rgba(255, 194, 57, 0.2); -} + } body.colorblind .matCell.p81 { background-image: url('../img/permanent-black-small-cb.png'); -} + } body.colorblind .matCell.p82 { background-image: url('../img/permanent-white-small-cb.png'); -} + } .matRow.rw .matCell { cursor: pointer; -} + } body.powerOff .matRow.rw .matCell { cursor: auto; opacity: 0.6; -} + } .top { font-weight: bold; -} + } #cellHotspots { margin: 0; @@ -586,7 +586,7 @@ body.powerOff .matRow.rw .matCell { width: 100%; height: 100%; z-index: 10; -} + } #whitelist, #blacklist { margin: 0; border: 0; @@ -596,54 +596,54 @@ body.powerOff .matRow.rw .matCell { width: 100%; height: 50%; background: transparent; -} + } #whitelist { top: 0; -} + } #blacklist { top: 50%; -} + } body.powerOff #whitelist, body.powerOff #blacklist { display: none; -} + } .rw .matCell.t1 #whitelist:hover { background-color: #080; opacity: 0.25; -} + } body.colorblind .rw .matCell.t1 #whitelist:hover, body.colorblind .rw .matCell.t2 #whitelist:hover { background-color: rgb(255, 194, 57); opacity: 0.6; -} + } .rw .matCell.t2 #whitelist:hover { background-color: #080; opacity: 0.25; -} + } .matCell.t81 #whitelist:hover { background-color: transparent; -} + } .matCell.t82 #whitelist:hover { background-color: transparent; -} + } .rw .matCell.t1 #blacklist:hover { background-color: #c00; opacity: 0.25; -} + } body.colorblind .rw .matCell.t1 #blacklist:hover, body.colorblind .rw .matCell.t2 #blacklist:hover { background-color: rgb(0, 19, 110); opacity: 0.4; -} + } .rw .matCell.t2 #blacklist:hover { background-color: #c00; opacity: 0.25; -} + } .matCell.t81 #blacklist:hover { background-color: transparent; -} + } .matCell.t82 #blacklist:hover { background-color: transparent; -} + } #domainOnly { margin: 0; border: 1px solid gray; @@ -659,35 +659,35 @@ body.colorblind .rw .matCell.t2 #blacklist:hover { opacity: 0.25; z-index: 10000; cursor: pointer; -} + } .matSection #domainOnly .fa:before { content: '\f106'; -} + } .matSection.collapsed #domainOnly .fa:before { content: '\f107'; -} + } .matSection.collapsible .matRow.l1 .matCell:nth-of-type(1):hover #domainOnly { display: block; -} + } #matHead #domainOnly .fa:before { content: '\f106'; -} + } #matHead.collapsed #domainOnly .fa:before { content: '\f107'; -} + } #matHead.collapsible .matRow .matCell:nth-of-type(1):hover #domainOnly { display: block; -} + } #domainOnly:hover { opacity: 1; -} + } /* No data was found for the tab */ body.noTabFound .paneHead, body.noTabFound .paneContent { display: none; -} + } body.noTabFound #noTabFound { align-items: center; color: gray; @@ -695,19 +695,19 @@ body.noTabFound #noTabFound { font-size: xx-large; height: 100vh; justify-content: center; -} + } /* Mobile-friendly rules */ body.hConstrained { overflow-x: auto; -} + } body.hConstrained .paneHead { left: auto; position: absolute; right: auto; width: 100%; -} + } body[data-touch="true"] .matCell { line-height: 200%; -} + } |