summaryrefslogtreecommitdiffstats
path: root/src/css
diff options
context:
space:
mode:
Diffstat (limited to 'src/css')
-rw-r--r--src/css/1p-filters.css7
-rw-r--r--src/css/3p-filters.css27
-rw-r--r--src/css/advanced-settings.css1
-rw-r--r--src/css/asset-viewer.css1
-rw-r--r--src/css/code-viewer.css1
-rw-r--r--src/css/codemirror.css47
-rw-r--r--src/css/common.css40
-rw-r--r--src/css/dashboard.css12
-rw-r--r--src/css/devtools.css1
-rw-r--r--src/css/document-blocked.css6
-rw-r--r--src/css/dom-inspector.css1
-rw-r--r--src/css/dyna-rules.css1
-rw-r--r--src/css/epicker-ui.css142
-rw-r--r--src/css/fa-icons.css2
-rw-r--r--src/css/logger-ui.css126
-rw-r--r--src/css/popup-fenix.css3
-rw-r--r--src/css/whitelist.css1
17 files changed, 260 insertions, 159 deletions
diff --git a/src/css/1p-filters.css b/src/css/1p-filters.css
index 679e4b8..9e087cb 100644
--- a/src/css/1p-filters.css
+++ b/src/css/1p-filters.css
@@ -1,5 +1,6 @@
html {
height: 100vh;
+ height: 100svh;
overflow: hidden;
width: 100vw;
}
@@ -14,7 +15,11 @@ body {
.body {
flex-shrink: 0;
}
-[data-i18n="1pTrustWarning"] {
+/* https://github.com/uBlockOrigin/uBlock-issues/issues/3058 */
+:root.mobile body {
+ min-height: unset;
+ }
+html:not(.mobile) [data-i18n="1pTrustWarning"] {
font-weight: bold;
}
.codeMirrorContainer {
diff --git a/src/css/3p-filters.css b/src/css/3p-filters.css
index 014dd20..f5bed6b 100644
--- a/src/css/3p-filters.css
+++ b/src/css/3p-filters.css
@@ -7,7 +7,6 @@ body {
}
#actions {
background-color: var(--surface-1);
- padding: var(--default-gap-small) 0 var(--default-gap-xsmall) 0;
position: sticky;
top: 0;
z-index: 10;
@@ -15,7 +14,8 @@ body {
#buttonUpdate.active {
pointer-events: none;
}
-#buttonUpdate.active .fa-icon svg {
+#buttonUpdate.active .fa-icon svg,
+body.working #buttonUpdate:not(.disabled) .fa-icon svg {
animation: spin 1s linear infinite;
transform-origin: 50%;
}
@@ -24,7 +24,7 @@ body.updating #actions,
body.working #actions {
cursor: progress;
}
-body.updating #actions button,
+body.updating #actions #buttonUpdate,
body.working #actions button {
pointer-events: none;
}
@@ -54,23 +54,9 @@ body.working #actions button {
transform: rotate(180deg);
}
-#lists .searchbar {
- align-items: center;
- column-gap: var(--default-gap-xxsmall);
- display: inline-flex;
+#lists .searchfield {
margin-block-start: calc(var(--font-size) * 0.75);
margin-inline-start: var(--checkbox-size);
- position: relative;
- }
-#lists .searchbar input {
- padding-inline-start: var(--default-gap-large);
- }
-#lists .searchbar .fa-icon {
- color: var(--ink-4);
- fill: var(--ink-4);
- left: 4px;
- position: absolute;
- transform: none;
}
#lists.searchMode > .listEntries .listEntries,
#lists.searchMode > .listEntries .listEntry.searchMatch {
@@ -212,13 +198,14 @@ body.working #actions button {
color: var(--info2-ink);
fill: var(--info2-ink);
}
-body:not(.updating) #lists .listEntry.checked.obsolete > .detailbar .iconbar .obsolete {
+body:not(.updating,.working) #lists .listEntry.checked.obsolete > .detailbar .iconbar .obsolete {
display: inline-flex;
}
#lists .iconbar .updating {
transform-origin: 50%;
}
-body.updating #lists .listEntry.checked.obsolete > .detailbar .iconbar .updating {
+body.updating #lists .listEntry.checked.obsolete > .detailbar .iconbar .updating,
+body.working #lists .listEntry.checked.obsolete:not(.cached) > .detailbar .iconbar .updating {
animation: spin 1s steps(8) infinite;
display: inline-flex;
}
diff --git a/src/css/advanced-settings.css b/src/css/advanced-settings.css
index c67e750..10225dd 100644
--- a/src/css/advanced-settings.css
+++ b/src/css/advanced-settings.css
@@ -1,5 +1,6 @@
html {
height: 100vh;
+ height: 100svh;
overflow: hidden;
width: 100vw;
}
diff --git a/src/css/asset-viewer.css b/src/css/asset-viewer.css
index 8b6f1da..d2df68a 100644
--- a/src/css/asset-viewer.css
+++ b/src/css/asset-viewer.css
@@ -23,6 +23,7 @@ body {
display: flex;
flex-direction: column;
height: 100vh;
+ height: 100svh;
margin: 0;
overflow: hidden;
padding: 0;
diff --git a/src/css/code-viewer.css b/src/css/code-viewer.css
index 774fa69..40b5114 100644
--- a/src/css/code-viewer.css
+++ b/src/css/code-viewer.css
@@ -3,6 +3,7 @@ body {
display: flex;
flex-direction: column;
height: 100vh;
+ height: 100svh;
margin: 0;
overflow: hidden;
padding: 0;
diff --git a/src/css/codemirror.css b/src/css/codemirror.css
index 2d15bf8..fce571b 100644
--- a/src/css/codemirror.css
+++ b/src/css/codemirror.css
@@ -3,6 +3,13 @@
overflow: hidden;
position: relative;
}
+.codeMirrorContainer.cm-maximized {
+ bottom: 0;
+ left: 0;
+ position: absolute;
+ right: 0;
+ top: 0;
+ }
.CodeMirror {
background-color: var(--surface-0);
box-sizing: border-box;
@@ -153,7 +160,6 @@
}
.cm-search-widget {
- align-items: center;
background-color: var(--cm-gutter-surface);
border-bottom: 1px solid var(--cm-gutter-border);
cursor: default;
@@ -162,6 +168,7 @@
flex-shrink: 0;
flex-wrap: wrap;
justify-content: space-between;
+ line-height: 1.5;
padding: var(--default-gap-xsmall);
row-gap: var(--default-gap-xsmall);
user-select: none;
@@ -176,20 +183,44 @@
text-align: end;
}
+.cm-search-widget .cm-maximize {
+ fill: none;
+ flex-grow: 0;
+ font-size: 130%;
+ height: 1em;
+ stroke-width: 3px;
+ stroke: var(--ink-0);
+ width: 1em;
+ }
+.cm-search-widget .cm-maximize * {
+ pointer-events: none;
+ }
+.codeMirrorContainer[data-maximizable="false"] .cm-search-widget .cm-maximize {
+ display: none;
+ }
+.codeMirrorContainer .cm-search-widget .cm-maximize svg > path:nth-child(2),
+.codeMirrorContainer.cm-maximized .cm-search-widget .cm-maximize svg > path:nth-child(1) {
+ display: none;
+ }
+.codeMirrorContainer.cm-maximized .cm-search-widget .cm-maximize svg > path:nth-child(2) {
+ display: initial;
+ }
+html:not(.mobile) .cm-search-widget .cm-maximize:hover {
+ transform: scale(1.2);
+ }
+
.cm-search-widget-input {
display: inline-flex;
flex-grow: 1;
+ flex-wrap: nowrap;
}
.cm-search-widget .fa-icon {
- fill: var(--cm-gutter-ink);
font-size: 140%;
}
-.cm-search-widget .fa-icon:not(.fa-icon-ro):hover {
- fill: var(--ink-1);
+html:not(.mobile) .cm-search-widget .fa-icon:not(.fa-icon-ro):hover {
+ transform: scale(1.2);
}
.cm-search-widget-input input {
- border: 1px solid var(--cm-gutter-ink);
- display: inline-flex;
flex-grow: 1;
max-width: 16em;
}
@@ -198,7 +229,6 @@
display: inline-flex;
flex-grow: 0;
font-size: var(--font-size-smaller);
- min-width: 6em;
visibility: hidden;
}
.cm-search-widget[data-query] .cm-search-widget-count {
@@ -207,9 +237,6 @@
.cm-search-widget[data-query] .cm-search-widget-count:empty {
visibility: hidden;
}
-.cm-search-widget .cm-search-widget-button:hover {
- color: #000;
- }
.cm-search-widget .sourceURL[href=""] {
visibility: hidden;
}
diff --git a/src/css/common.css b/src/css/common.css
index 1a8ba0b..fae4bb5 100644
--- a/src/css/common.css
+++ b/src/css/common.css
@@ -52,11 +52,11 @@ body {
margin: 0;
padding: 0;
}
-a {
+a:not(.fa-icon) {
color: var(--link-ink);
fill: var(--link-ink);
}
-a:hover {
+a:not(.fa-icon):hover {
color: var(--link-hover-ink);
fill: var(--link-hover-ink);
}
@@ -271,6 +271,24 @@ select {
padding: 2px;
}
+.searchfield {
+ align-items: center;
+ column-gap: var(--default-gap-xxsmall);
+ display: inline-flex;
+ position: relative;
+ }
+.searchfield .fa-icon {
+ color: var(--ink-4);
+ fill: var(--ink-4);
+ font-size: 1em !important;
+ left: 2px;
+ position: absolute;
+ transform: none;
+ }
+.searchfield input:not(:placeholder-shown) ~ .fa-icon {
+ display: none;
+ }
+
.hidden {
display: none;
height: 0;
@@ -309,7 +327,7 @@ select {
font-size: 1.2rem;
padding: 0;
}
- button.iconified > [data-i18n] {
+ button.iconified:not(.dontshrink) > [data-i18n] {
display: none;
}
}
@@ -331,6 +349,22 @@ select {
width: 100%;
}
+.wikilink[href=""] {
+ display: none;
+ }
+.wikilink.fa-icon {
+ color: var(--info0-ink);
+ fill: var(--info0-ink);
+ padding: var(--default-gap-xxsmall) var(--default-gap-xsmall);
+ }
+.wikilink.fa-icon:hover {
+ transform: scale(1.2);
+ }
+.wikilink.fa-icon > svg {
+ height: 1.25rem;
+ width: 1.25rem;
+ }
+
/* high dpi devices */
:root.hidpi button {
font-family: Metropolis, sans-serif;
diff --git a/src/css/dashboard.css b/src/css/dashboard.css
index ba02d97..b75949e 100644
--- a/src/css/dashboard.css
+++ b/src/css/dashboard.css
@@ -2,6 +2,7 @@ html, body {
display: flex;
flex-direction: column;
height: 100vh;
+ height: 100svh;
justify-content: stretch;
overflow: hidden;
position: relative;
@@ -11,11 +12,12 @@ body.notReady {
display: none;
}
#dashboard-nav {
+ align-items: center;
border: 0;
border-bottom: 1px solid var(--border-1);
display: flex;
flex-shrink: 0;
- flex-wrap: wrap;
+ justify-content: space-between;
overflow-x: hidden;
padding: 0;
position: sticky;
@@ -23,6 +25,10 @@ body.notReady {
width: 100%;
z-index: 10;
}
+#dashboard-nav > span {
+ display: flex;
+ flex-wrap: wrap;
+ }
.tabButton {
background-color: transparent;
border: 0;
@@ -75,6 +81,7 @@ iframe {
}
#unsavedWarning > div:last-of-type {
height: 100vh;
+ height: 100svh;
position: absolute;
width: 100vw;
}
@@ -105,8 +112,7 @@ body.noDashboard #dashboard-nav {
border-bottom-color: var(--dashboard-tab-hover-border);
}
-/* touch-screen devices */
-:root.mobile #dashboard-nav {
+:root.mobile #dashboard-nav > span {
flex-wrap: nowrap;
overflow-x: auto;
}
diff --git a/src/css/devtools.css b/src/css/devtools.css
index 425aac4..bb4c40d 100644
--- a/src/css/devtools.css
+++ b/src/css/devtools.css
@@ -1,5 +1,6 @@
html {
height: 100vh;
+ height: 100svh;
overflow: hidden;
width: 100vw;
}
diff --git a/src/css/document-blocked.css b/src/css/document-blocked.css
index 25dd204..62d4921 100644
--- a/src/css/document-blocked.css
+++ b/src/css/document-blocked.css
@@ -42,10 +42,10 @@ a {
word-break: break-all;
}
#warningSign {
- width: 100%;
- }
-#warningSign > a {
+ color: var(--accent-surface-1);
+ fill: var(--accent-surface-1);
font-size: 96px;
+ width: 100%;
}
#theURL {
color: var(--ink-2);
diff --git a/src/css/dom-inspector.css b/src/css/dom-inspector.css
index 71ba348..2f2ca14 100644
--- a/src/css/dom-inspector.css
+++ b/src/css/dom-inspector.css
@@ -3,6 +3,7 @@ html#ublock0-inspector,
background: transparent;
box-sizing: border-box;
height: 100vh;
+ height: 100svh;
margin: 0;
overflow: hidden;
width: 100vw;
diff --git a/src/css/dyna-rules.css b/src/css/dyna-rules.css
index 35e0f8c..9a6bd8d 100644
--- a/src/css/dyna-rules.css
+++ b/src/css/dyna-rules.css
@@ -1,5 +1,6 @@
html {
height: 100vh;
+ height: 100svh;
overflow: hidden;
width: 100vw;
}
diff --git a/src/css/epicker-ui.css b/src/css/epicker-ui.css
index d09e1ef..8ce5ade 100644
--- a/src/css/epicker-ui.css
+++ b/src/css/epicker-ui.css
@@ -3,6 +3,7 @@ html#ublock0-epicker,
background: transparent;
cursor: not-allowed;
height: 100vh;
+ height: 100svh;
margin: 0;
overflow: hidden;
width: 100vw;
@@ -13,29 +14,41 @@ html#ublock0-epicker,
#ublock0-epicker aside {
background-color: var(--surface-1);
border: 1px solid var(--border-2);
- bottom: 2px;
box-sizing: border-box;
cursor: default;
display: none;
- max-height: calc(100vh - 4px);
- max-width: 36rem;
- min-width: 24rem;
+ flex-direction: column;
+ max-width: min(32rem, 100vw - 4px);
+ min-width: min(24rem, 100vw - 4px);
overflow-y: auto;
- padding: 4px;
position: fixed;
- right: 2px;
- width: calc(40% - 2px);
+ width: min(32rem, 100vw - 4px);
+ z-index: 100;
}
-/* https://github.com/uBlockOrigin/uBlock-issues/discussions/2114 */
-#ublock0-epicker aside {
- min-width: min(24rem, 100vw - 4px);
+#ublock0-epicker:not(.zap) aside {
+ display: flex;
+}
+#ublock0-epicker:not(.paused) aside,
+#ublock0-epicker.minimized aside {
+ min-width: min(16rem, 100vw - 4px);
+ overflow: hidden;
+ width: min(16rem, 100vw - 4px);
+}
+#ublock0-epicker:not(.paused) aside > *:not(#windowbar),
+#ublock0-epicker.minimized aside > *:not(#windowbar) {
+ display: none;
}
-#ublock0-epicker.paused:not(.zap) aside {
- display: block;
+#ublock0-epicker aside > *:not(:first-child) {
+ padding: 0 2px;
}
+
#ublock0-epicker #toolbar {
display: flex;
+ justify-content: space-between;
}
+#ublock0-epicker #toolbar button {
+ min-width: 5em;
+ }
#ublock0-epicker ul {
margin: 0.25em 0 0 0;
}
@@ -43,16 +56,6 @@ html#ublock0-epicker,
background-color: var(--button-preferred-surface);
color: var(--button-preferred-ink);
}
-#ublock0-epicker #move {
- background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAECAYAAACtBE5DAAAAFElEQVQI12NgwAfKy8v/M5ANYLoBshgEyQo6H9UAAAAASUVORK5CYII=');
- cursor: grab;
- flex-grow: 1;
- margin: 2px 4px;
- opacity: 0.8;
- }
-#ublock0-epicker aside.moving #move {
- cursor: grabbing;
-}
#ublock0-epicker section {
border: 0;
box-sizing: border-box;
@@ -70,8 +73,8 @@ html#ublock0-epicker,
#ublock0-epicker section .codeMirrorContainer {
border: none;
box-sizing: border-box;
- height: 8em;
- max-height: 50vh;
+ height: 6em;
+ max-height: min(6em, 10vh);
min-height: 1em;
padding: 2px;
width: 100%;
@@ -129,8 +132,8 @@ html#ublock0-epicker,
);
display: inline-block;
flex-shrink: 0;
- height: 16px;
- width: 16px;
+ height: 20px;
+ width: 20px;
}
.resultsetModifier > span > span:nth-of-type(3) {
background-color: var(--surface-3);
@@ -174,12 +177,9 @@ html#ublock0-epicker,
overflow: hidden;
}
#ublock0-epicker #candidateFilters {
- max-height: 14em;
+ max-height: min(12em, 18vh);
overflow-y: auto;
}
-#ublock0-epicker #candidateFilters > li:first-of-type {
- margin-bottom: 0.5em;
-}
#ublock0-epicker .changeFilter > li > span:nth-of-type(1) {
font-weight: bold;
}
@@ -187,6 +187,9 @@ html#ublock0-epicker,
font-size: smaller;
color: gray;
}
+#ublock0-epicker #candidateFilters [data-i18n] {
+ font-size: 90%;
+}
#ublock0-epicker #candidateFilters .changeFilter {
list-style-type: none;
margin: 0 0 0 1em;
@@ -207,36 +210,7 @@ html#ublock0-epicker,
background-color: var(--surface-2);
}
-/**
- https://github.com/gorhill/uBlock/issues/3449
- https://github.com/uBlockOrigin/uBlock-issues/issues/55
-**/
-@keyframes startDialog {
- 0% { opacity: 1.0; }
- 60% { opacity: 1.0; }
- 100% { opacity: 0.1; }
-}
-#ublock0-epicker.paused aside {
- opacity: 0.1;
- visibility: visible;
- z-index: 100;
-}
-#ublock0-epicker.paused:not(.show):not(.hide) aside:not(:hover) {
- animation-duration: 1.6s;
- animation-name: startDialog;
- animation-timing-function: linear;
-}
-#ublock0-epicker.paused aside:hover {
- opacity: 1;
-}
-#ublock0-epicker.paused.show aside {
- opacity: 1;
-}
-#ublock0-epicker.paused.hide aside {
- opacity: 0.1;
-}
-
-#ublock0-epicker svg {
+#ublock0-epicker svg#sea {
cursor: crosshair;
box-sizing: border-box;
height: 100%;
@@ -245,26 +219,62 @@ html#ublock0-epicker,
top: 0;
width: 100%;
}
-#ublock0-epicker.paused svg {
+#ublock0-epicker.paused svg#sea {
cursor: not-allowed;
}
-#ublock0-epicker svg > path:first-child {
+#ublock0-epicker svg#sea > path:first-child {
fill: rgba(0,0,0,0.5);
fill-rule: evenodd;
}
-#ublock0-epicker svg > path + path {
+#ublock0-epicker svg#sea > path + path {
stroke: #F00;
stroke-width: 0.5px;
fill: rgba(255,63,63,0.20);
}
-#ublock0-epicker.zap svg > path + path {
+#ublock0-epicker.zap svg#sea > path + path {
stroke: #FF0;
stroke-width: 0.5px;
fill: rgba(255,255,63,0.20);
}
-#ublock0-epicker.preview svg > path {
+#ublock0-epicker.preview svg#sea > path {
fill: rgba(0,0,0,0.10);
}
-#ublock0-epicker.preview svg > path + path {
+#ublock0-epicker.preview svg#sea > path + path {
stroke: none;
}
+
+
+#ublock0-epicker #windowbar {
+ display: flex;
+}
+#ublock0-epicker #windowbar svg {
+ fill: none;
+ pointer-events: none;
+ stroke: var(--ink-1);
+ stroke-width: 3px;
+}
+#ublock0-epicker #windowbar #move {
+ background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAECAYAAACtBE5DAAAAFElEQVQI12NgwAfKy8v/M5ANYLoBshgEyQo6H9UAAAAASUVORK5CYII=');
+ cursor: grab;
+ flex-grow: 1;
+ opacity: 0.8;
+}
+#ublock0-epicker aside.moving #windowbar #move {
+ cursor: grabbing;
+}
+#windowbar #quit,
+#windowbar #minimize {
+ height: 2em;
+ width: 2em;
+}
+#windowbar #quit:hover,
+#windowbar #minimize:hover {
+ background-color: var(--surface-2)
+}
+#ublock0-epicker.minimized #windowbar #minimize svg > path,
+#windowbar #minimize svg > rect {
+ display: none;
+}
+#ublock0-epicker.minimized #windowbar #minimize svg > rect {
+ display: initial;
+}
diff --git a/src/css/fa-icons.css b/src/css/fa-icons.css
index f6d517d..adac445 100644
--- a/src/css/fa-icons.css
+++ b/src/css/fa-icons.css
@@ -89,12 +89,14 @@
.fa-icon > .fa-icon_sun-o {
width: calc(1em * 1708 / 1792);
}
+.fa-icon > .fa-icon_book,
.fa-icon > .fa-icon_download-alt,
.fa-icon > .fa-icon_font,
.fa-icon > .fa-icon_search,
.fa-icon > .fa-icon_spinner,
.fa-icon > .fa-icon_unlink,
.fa-icon > .fa-icon_upload-alt,
+.fa-icon > .fa-icon_volume-up,
.fa-icon > .fa-icon_zoom-in,
.fa-icon > .fa-icon_zoom-out {
width: calc(1em * 1664 / 1792);
diff --git a/src/css/logger-ui.css b/src/css/logger-ui.css
index 8e5065c..7ae632e 100644
--- a/src/css/logger-ui.css
+++ b/src/css/logger-ui.css
@@ -2,6 +2,7 @@ body {
display: flex;
flex-direction: column;
height: 100vh;
+ height: 100svh;
overflow: hidden;
width: 100vw;
}
@@ -218,6 +219,7 @@ body[dir="rtl"] #netInspector #filterExprPicker {
width: 100%;
}
#vwRenderer .logEntry {
+ background-color: var(--surface-1);
display: block;
left: 0;
overflow: hidden;
@@ -228,7 +230,11 @@ body[dir="rtl"] #netInspector #filterExprPicker {
display: none;
}
#vwRenderer .logEntry > div {
+ border-bottom: 1px dotted var(--border-1);
+ box-sizing: border-box;
+ display: flex;
height: 100%;
+ max-height: 200px;
white-space: nowrap;
}
#vwRenderer .logEntry > div[data-status="1"],
@@ -271,7 +277,7 @@ body[dir="rtl"] #netInspector #filterExprPicker {
color: white;
}
#vwRenderer .logEntry > div[data-type="error"] {
- color: var(--sf-error-ink);
+ color: var(--cm-negative);
}
#vwRenderer .logEntry > div[data-type="info"] {
color: var(--sf-def-ink);
@@ -283,10 +289,8 @@ body[dir="rtl"] #netInspector #filterExprPicker {
opacity: 0.7;
}
-#vwRenderer .logEntry > div > span {
- border: 1px dotted var(--border-1);
- border-top: 0;
- border-right: 0;
+#vwRenderer .logEntry > .fields > span {
+ border-left: 1px dotted var(--border-1);
box-sizing: border-box;
display: inline-block;
height: 100%;
@@ -296,86 +300,74 @@ body[dir="rtl"] #netInspector #filterExprPicker {
white-space: nowrap;
word-break: break-all;
}
-#vwRenderer .logEntry > div.canDetails:hover > span {
+#vwRenderer .logEntry > div:hover > span {
background-color: rgba(0,0,0,0.04);
}
-body[dir="ltr"] #vwRenderer .logEntry > div > span:first-child {
+body[dir="ltr"] #vwRenderer .logEntry > .fields > span:first-child {
border-left: 0;
}
-body[dir="rtl"] #vwRenderer .logEntry > div > span:first-child {
+body[dir="rtl"] #vwRenderer .logEntry > .fields > span:first-child {
border-right: 0;
}
#vwRenderer .logEntry > div > span:nth-of-type(1) {
}
#vwRenderer .logEntry > div > span:nth-of-type(2) {
}
-#vwRenderer .logEntry > div > span:nth-of-type(2) {
+#vwRenderer .logEntry > .fields > span:nth-of-type(2) {
text-overflow: ellipsis;
}
-#vwRenderer .logEntry > div.messageRealm > span:nth-of-type(2) ~ span {
+#vwRenderer .logEntry > .fields.messageRealm > span:nth-of-type(2) ~ span {
display: none;
}
-.vExpanded #vwRenderer #vwContent .logEntry > div > span:nth-of-type(2) {
+.vExpanded #vwRenderer #vwContent .logEntry > .fields > span:nth-of-type(2) {
overflow-y: auto;
white-space: pre-line;
}
-#vwRenderer .logEntry > div.messageRealm[data-type="tabLoad"] > span:nth-of-type(2) {
+#vwRenderer .logEntry > .fields.messageRealm[data-type="tabLoad"] > span:nth-of-type(2) {
text-align: center;
}
-#vwRenderer .logEntry > div.extendedRealm > span:nth-of-type(2) > span:first-of-type {
+#vwRenderer .logEntry > .fields.extendedRealm > span:nth-of-type(2) > span:first-of-type {
display: none;
}
-#vwRenderer .logEntry > div.extendedRealm > span:nth-of-type(2) > span:last-of-type {
- pointer-events: none;
- }
-#vwRenderer .logEntry > div.extendedRealm.isException > span:nth-of-type(2) > span:last-of-type {
+#vwRenderer .logEntry > .fields.extendedRealm.isException > span:nth-of-type(2) > span:last-of-type {
text-decoration: line-through rgba(0,0,255,0.7);
}
-#vwRenderer .logEntry > div > span:nth-of-type(3) {
+#vwRenderer .logEntry > .fields > span:nth-of-type(3) {
font-family: monospace;
padding-left: 0.3em;
padding-right: 0.3em;
text-align: center;
}
-#vwRenderer .logEntry > div.canDetails:hover > span:not(:nth-of-type(4)):not(:nth-of-type(8)) {
- background: rgba(0, 0, 255, 0.1);
- cursor: zoom-in;
- }
-#netInspector:not(.vExpanded) #vwRenderer .logEntry > div > span:nth-of-type(4) {
- direction: rtl;
+#netInspector:not(.vExpanded) #vwRenderer .logEntry > .fields > span:nth-of-type(4) {
text-align: right;
- unicode-bidi: plaintext;
}
-#vwRenderer #vwContent .logEntry > div > span:nth-of-type(4) {
+#vwRenderer #vwContent .logEntry > .fields > span:nth-of-type(4) {
text-overflow: ellipsis;
}
-.vExpanded #vwRenderer #vwContent .logEntry > div > span:nth-of-type(4) {
+.vExpanded #vwRenderer #vwContent .logEntry > .fields > span:nth-of-type(4) {
overflow-y: auto;
text-overflow: clip;
white-space: pre-line;
}
-#vwRenderer .logEntry > div > span:nth-of-type(5) {
+#vwRenderer .logEntry > .fields > span:nth-of-type(5) {
text-align: center;
}
-/* visual for tabless network requests */
-#vwRenderer .logEntry > div > span:nth-of-type(5) {
- position: relative;
+#vwRenderer .logEntry > .fields > span:nth-of-type(3),
+#vwRenderer .logEntry > .fields > span:nth-of-type(5),
+#vwRenderer .logEntry > .fields > span:nth-of-type(7) {
+ white-space: nowrap !important;
}
-#vwRenderer .logEntry > div > span:nth-of-type(7) {
- }
-#vwRenderer #vwContent .logEntry > div > span:nth-of-type(7) {
- }
-#vwRenderer .logEntry > div > span:nth-of-type(8) {
+#vwRenderer .logEntry > .fields > span:nth-of-type(8) {
position: relative;
}
-#vwRenderer #vwContent .logEntry > div > span:nth-of-type(8) {
+#vwRenderer #vwContent .logEntry > .fields > span:nth-of-type(8) {
text-overflow: ellipsis;
}
-.vExpanded #vwRenderer #vwContent .logEntry > div > span:nth-of-type(8) {
+.vExpanded #vwRenderer #vwContent .logEntry > .fields > span:nth-of-type(8) {
overflow-y: auto;
white-space: pre-line;
}
-#vwRenderer .logEntry > div > span:nth-of-type(8) b {
+#vwRenderer .logEntry > .fields > span:nth-of-type(8) b {
font-weight: bold;
}
#vwRenderer .logEntry > div[data-status="1"] > span:nth-of-type(8) b,
@@ -396,37 +388,65 @@ body[dir="rtl"] #vwRenderer .logEntry > div > span:first-child {
.netFilteringDialog > .panes > .details > div[data-status="2"] b {
background-color: rgb(var(--popup-cell-allow-surface-rgb) / 100%);
}
-#vwRenderer .logEntry > div > span:nth-of-type(8) a {
+#vwRenderer .logEntry > .fields > span:nth-of-type(8) a {
align-items: center;
background-color: dimgray;
+ bottom: 0;
color: white;
display: none;
- height: 100%;
+ height: min(100%, 1.5em);
justify-content: center;
- padding: 0 0.25em;
+ padding: 0.1em;
opacity: 0.4;
position: absolute;
right: 0;
text-decoration: none;
- top: 0;
- width: 2rem;
+ width: 1.5em;
}
-#netInspector.vExpanded #vwRenderer .logEntry > div > span:nth-of-type(8) a {
+#netInspector.vExpanded #vwRenderer .logEntry > .fields > span:nth-of-type(8) a {
bottom: 0px;
height: unset;
- padding: 0.25em;
+ padding: 0.2em;
top: unset;
}
-#vwRenderer .logEntry > div > span:nth-of-type(8) a::after {
+#vwRenderer .logEntry > .fields > span:nth-of-type(8) a::after {
content: '\2197';
}
-#vwRenderer .logEntry > div.networkRealm > span:nth-of-type(8):hover a {
+#vwRenderer .logEntry > .fields.networkRealm > span:nth-of-type(8):hover a {
display: inline-flex;
}
-#vwRenderer .logEntry > div > span:nth-of-type(8) a:hover {
+#vwRenderer .logEntry > .fields > span:nth-of-type(8) a:hover {
opacity: 1;
}
+@keyframes unrollRow {
+ to {
+ box-shadow: 0 2px 3px 0 #444;
+ height: auto;
+ max-height: 200px;
+ z-index: 1;
+ }
+}
+@keyframes unrollRowCell {
+ to {
+ height: auto;
+ overflow-y: auto;
+ white-space: pre-wrap;
+ }
+}
+#netInspector:not(.vExpanded) #vwRenderer .logEntry:hover {
+ animation-delay: 0.8s;
+ animation-fill-mode: forwards;
+ animation-name: unrollRow;
+ animation-timing-function: step-start;
+ }
+#netInspector:not(.vExpanded) #vwRenderer .logEntry:hover > .fields > span {
+ animation-delay: 0.8s;
+ animation-fill-mode: forwards;
+ animation-name: unrollRowCell;
+ animation-timing-function: step-start;
+ }
+
#vwRenderer #vwBottom {
background-color: #00F;
height: 0;
@@ -448,6 +468,7 @@ body[dir="rtl"] #vwRenderer .logEntry > div > span:first-child {
max-width: 640px;
min-width: min(100%, 640px);
position: absolute;
+ z-index: 2;
}
#netInspector .entryTools:empty {
display: none;
@@ -492,6 +513,7 @@ body[dir="rtl"] .closeButton {
bottom: 0;
display: none;
max-height: min(800px, calc(100vh - 2rem));
+ max-height: min(800px, calc(100svh - 2rem));
min-width: 360px;
overflow: hidden;
position: fixed;
@@ -947,10 +969,10 @@ body.dirty .netFilteringDialog > div.panes > .dynamic > .toolbar #saveRules {
background-color: rgb(var(--primary-70) / 40%);
}
#loggerExportDialog .output {
- font: smaller mono;
- height: 60vh;
+ font-size: small;
+ height: 80vh;
padding: 0.5em;
- white-space: pre;
+ white-space: pre-wrap;
}
#loggerSettingsDialog {
diff --git a/src/css/popup-fenix.css b/src/css/popup-fenix.css
index 252e371..b845562 100644
--- a/src/css/popup-fenix.css
+++ b/src/css/popup-fenix.css
@@ -211,7 +211,7 @@ body.needSave #revertRules {
font-size: 1.6em;
}
-#basicTools:not(.canPick) .needPick {
+#basicTools .needPick:not(.canPick) {
visibility: hidden;
}
@@ -300,6 +300,7 @@ body.needSave #revertRules {
}
:root.desktop body.vMin #firewall {
max-height: 100vh;
+ max-height: 100svh;
}
#firewall > * {
direction: ltr;
diff --git a/src/css/whitelist.css b/src/css/whitelist.css
index 715c964..3248a77 100644
--- a/src/css/whitelist.css
+++ b/src/css/whitelist.css
@@ -1,5 +1,6 @@
html {
height: 100vh;
+ height: 100svh;
overflow: hidden;
width: 100vw;
}
generated by cgit v1.2.3 (git 2.39.1) at 2024-11-22 08:05:00 +0000