From bc0235861046c2980ed9bed008877cd8e577b9ba Mon Sep 17 00:00:00 2001 From: Raymond Hill Date: Sat, 6 May 2023 18:56:00 -0400 Subject: [PATCH] Use a different surface color for scriptlets in logger Related feedback: - https://github.com/uBlockOrigin/uBlock-issues/discussions/2636 --- src/css/logger-ui.css | 3 +++ src/css/themes/default.css | 4 +++- src/js/logger-ui.js | 6 +++++- 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/src/css/logger-ui.css b/src/css/logger-ui.css index d164b6e78..53f108487 100644 --- a/src/css/logger-ui.css +++ b/src/css/logger-ui.css @@ -249,6 +249,9 @@ body[dir="rtl"] #netInspector #filterExprPicker { #vwRenderer .logEntry > div.redirect { background-color: var(--logger-redirected-surface); } +#vwRenderer .logEntry > div.extendedRealm.scriptlet { + background-color: var(--logger-scriptlet-surface); + } :root.colorBlind #vwRenderer .logEntry > div.extendedRealm, :root.colorBlind #vwRenderer .logEntry > div.redirect { background-color: rgba(0, 19, 110, 0.1); diff --git a/src/css/themes/default.css b/src/css/themes/default.css index a9b569af7..44609817e 100644 --- a/src/css/themes/default.css +++ b/src/css/themes/default.css @@ -297,8 +297,9 @@ /* logger */ --logger-modified-surface: #0000c010; - --logger-redirected-surface: rgb(var(--yellow-5) / 50%); --logger-modified-em-surface: #0000c028; + --logger-redirected-surface: rgb(var(--yellow-5) / 50%); + --logger-scriptlet-surface: rgb(var(--yellow-30) / 50%); } /* https://material.io/design/color/dark-theme.html */ @@ -374,6 +375,7 @@ /* logger */ --logger-modified-surface: #663efd60; --logger-redirected-surface: rgb(var(--yellow-5) / 40%); + --logger-scriptlet-surface: rgb(var(--yellow-30) / 40%); } :root.dark input, diff --git a/src/js/logger-ui.js b/src/js/logger-ui.js index 00002c3a5..f71510766 100644 --- a/src/js/logger-ui.js +++ b/src/js/logger-ui.js @@ -797,7 +797,11 @@ const viewPort = (( ) => { } } span = div.children[COLUMN_FILTER]; - if ( renderFilterToSpan(span, cells[COLUMN_FILTER]) === false ) { + if ( renderFilterToSpan(span, cells[COLUMN_FILTER]) ) { + if ( /^\+js\(.*\)$/.test(span.children[1].textContent) ) { + divcl.add('scriptlet'); + } + } else { span.textContent = cells[COLUMN_FILTER]; }