From 2501eae25f1786ed9a8d6038e332d502087623e7 Mon Sep 17 00:00:00 2001 From: Raymond Hill Date: Mon, 31 Mar 2025 17:43:51 -0400 Subject: [PATCH] [mv3] Fine tune zapper's quit button Related issue: https://github.com/uBlockOrigin/uBlock-issues/issues/3587 --- platform/mv3/extension/css/zapper-ui.css | 16 ++++++++++++++-- platform/mv3/extension/zapper-ui.html | 2 +- 2 files changed, 15 insertions(+), 3 deletions(-) diff --git a/platform/mv3/extension/css/zapper-ui.css b/platform/mv3/extension/css/zapper-ui.css index cf729ac47..4385d626d 100644 --- a/platform/mv3/extension/css/zapper-ui.css +++ b/platform/mv3/extension/css/zapper-ui.css @@ -1,3 +1,7 @@ +:root { + --quit-button-size: max(4em, min(6em, calc(100vw / 8), calc(100vh / 8))); +} + html#ubol-zapper, #ubol-zapper body { background: transparent; @@ -18,14 +22,22 @@ html#ubol-zapper, display: flex; flex-direction: column; position: fixed; + right: 2px; + top: 50%; + transform: translateY(-50%); z-index: 100; } +#ubol-zapper body[dir="rtl"] aside { + left: 2px; + right: unset; +} #ubol-zapper aside > #quit { + border: 1px solid rgba(0,0,0,0.5); fill: none; - height: 4em; stroke: var(--ink-1); stroke-width: 3px; - width: 4em; + width: var(--quit-button-size); + height: var(--quit-button-size); } #ubol-zapper svg#sea { cursor: crosshair; diff --git a/platform/mv3/extension/zapper-ui.html b/platform/mv3/extension/zapper-ui.html index 3e0ef51f8..a739d97a4 100644 --- a/platform/mv3/extension/zapper-ui.html +++ b/platform/mv3/extension/zapper-ui.html @@ -10,7 +10,7 @@ -