From ba5ef6857c6f7547c3f4ce970eb82d4255ae495f Mon Sep 17 00:00:00 2001
From: fen4flo <75260616+FlorianButz@users.noreply.github.com>
Date: Sun, 12 Apr 2026 19:45:58 +0200
Subject: [PATCH] chore: Visual changes and zap fixes, c=boosts, b=no-bug
 (#13225)

---
 src/zen/boosts/ZenBoostStyles.sys.mjs        |  2 +-
 src/zen/boosts/ZenBoostsEditor.mjs           |  6 +++++-
 src/zen/boosts/ZenZapDissolve.sys.mjs        |  4 ++--
 src/zen/boosts/actors/ZenBoostsChild.sys.mjs |  3 +++
 src/zen/boosts/zen-boosts.css                |  4 ++--
 src/zen/boosts/zen-selector.css              |  6 +++---
 src/zen/boosts/zen-zap.css                   | 20 ++++++++++----------
 7 files changed, 26 insertions(+), 19 deletions(-)

diff --git a/src/zen/boosts/ZenBoostStyles.sys.mjs b/src/zen/boosts/ZenBoostStyles.sys.mjs
index 72d70a66d..a4936c25b 100644
--- a/src/zen/boosts/ZenBoostStyles.sys.mjs
+++ b/src/zen/boosts/ZenBoostStyles.sys.mjs
@@ -68,7 +68,7 @@ export class nsZenBoostStyles {
     let zapBlocks = "";
     if (boostData.zapSelectors) {
       for (const selector of boostData.zapSelectors) {
-        zapBlocks += `html > body ${selector}:not([zen-zap-unhide]){ display: none !important; }\n`;
+        zapBlocks += `${selector}:not([zen-zap-unhide]){ display: none !important; }\n`;
       }
 
       if (zapBlocks != "") {
diff --git a/src/zen/boosts/ZenBoostsEditor.mjs b/src/zen/boosts/ZenBoostsEditor.mjs
index d24152d24..ffc794918 100644
--- a/src/zen/boosts/ZenBoostsEditor.mjs
+++ b/src/zen/boosts/ZenBoostsEditor.mjs
@@ -461,9 +461,12 @@ ${cssSelector} {
     const actor =
       linkedBrowser.browsingContext.currentWindowGlobal.getActor("ZenBoosts");
     const zapButton = this.doc.getElementById("zen-boost-zap");
+    
     const zapEnabled = await actor.sendQuery("ZenBoost:ZapModeEnabled");
+    // Checks if there are any zaps
+    const zapAny = await actor.sendQuery("ZenBoost:ZapModeAny");
 
-    zapButton.setAttribute("enabled", zapEnabled ? "true" : "false");
+    zapButton.setAttribute("enabled", (zapEnabled || zapAny) ? "true" : "false");
   }
 
   async onUpdatePickerButtonVisual() {
@@ -1295,6 +1298,7 @@ ${cssSelector} {
     this.updateDot();
     this.updateCircleRadius();
     this.onUpdateZapValue();
+    this.onUpdateZapButtonVisual();
   }
 
   /**
diff --git a/src/zen/boosts/ZenZapDissolve.sys.mjs b/src/zen/boosts/ZenZapDissolve.sys.mjs
index 860aff172..76402463c 100644
--- a/src/zen/boosts/ZenZapDissolve.sys.mjs
+++ b/src/zen/boosts/ZenZapDissolve.sys.mjs
@@ -509,8 +509,8 @@ void main() {
 
     ctx.drawWindow(
       this.window,
-      rect.left,
-      rect.top,
+      rect.left + this.window.scrollX,
+      rect.top + this.window.scrollY,
       rect.width,
       rect.height,
       "rgba(0,0,0,0)"
diff --git a/src/zen/boosts/actors/ZenBoostsChild.sys.mjs b/src/zen/boosts/actors/ZenBoostsChild.sys.mjs
index 855d80ce4..a40acd325 100644
--- a/src/zen/boosts/actors/ZenBoostsChild.sys.mjs
+++ b/src/zen/boosts/actors/ZenBoostsChild.sys.mjs
@@ -262,6 +262,9 @@ export class ZenBoostsChild extends JSWindowActorChild {
         break;
       case "ZenBoost:ZapModeEnabled":
         return this.#currentState === ZenBoostsChild.STATES.ZAP;
+      case "ZenBoost:ZapModeAny":
+        const { boostData } = (await this.getWebsiteBoost()).boostEntry;
+        return boostData.zapSelectors.length > 0;
       case "ZenBoost:SelectorPickerModeEnabled":
         return this.#currentState === ZenBoostsChild.STATES.PICKER;
       case "ZenBoost:OpenInspector":
diff --git a/src/zen/boosts/zen-boosts.css b/src/zen/boosts/zen-boosts.css
index 5a6bdfc28..33ab7a011 100644
--- a/src/zen/boosts/zen-boosts.css
+++ b/src/zen/boosts/zen-boosts.css
@@ -534,11 +534,11 @@ body {
 }
 
 .zen-boost-font-button-active {
-  background-color: #5b5b5c22 !important;
+  background-color: #5454572f;
 }
 
 .zen-boost-font-button-active:hover {
-  background-color: #5b5b5c32 !important;
+  background-color: #5b5b5c28;
 }
 
 @property --mod-button-c1 {
diff --git a/src/zen/boosts/zen-selector.css b/src/zen/boosts/zen-selector.css
index fad947b4e..7e7cde34e 100644
--- a/src/zen/boosts/zen-selector.css
+++ b/src/zen/boosts/zen-selector.css
@@ -17,11 +17,11 @@
 
 #select-component {
   width: min-content;
-  font-family: system-ui !important;
+  font-family: system-ui;
 
   height: 98px;
 
-  pointer-events: auto !important;
+  pointer-events: auto;
 
   transform-origin: top;
   overflow: hidden;
@@ -182,7 +182,7 @@
 #selector-element-preview-text {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 9pt;
-  color: #797b7f;
+  color: rgb(76, 78, 80);
 }
 
 #hover-div {
diff --git a/src/zen/boosts/zen-zap.css b/src/zen/boosts/zen-zap.css
index 6c65934d1..fd28f1fa3 100644
--- a/src/zen/boosts/zen-zap.css
+++ b/src/zen/boosts/zen-zap.css
@@ -53,10 +53,10 @@
 }
 
 #zap-controls-container {
-  font-family: system-ui !important;
+  font-family: system-ui;
 
   display: flex;
-  pointer-events: auto !important;
+  pointer-events: auto;
   z-index: 999999;
 
   bottom: 8px;
@@ -92,7 +92,7 @@
     }
 
     border: none;
-    background: linear-gradient(0deg, #afafaf 0%, #e5e5e5 100%) !important;
+    background: linear-gradient(0deg, #afafaf 0%, #e5e5e5 100%);
 
     color: #1d1b1b;
     font-weight: bold;
@@ -148,11 +148,11 @@
 }
 
 #zen-zap-dissolve-canvas {
-  position: absolute !important;
-  width: 100% !important;
-  height: 100% !important;
-  left: 0 !important;
-  top: 0 !important;
-  pointer-events: none !important;
-  z-index: 2147483647 !important;
+  position: fixed;
+  width: 100%;
+  height: 100%;
+  left: 0;
+  top: 0;
+  pointer-events: none;
+  z-index: 2147483647;
 }