Lean v3: Increase contrast of passive extension buttons & invert them in dark mode

KiKaraage · web-flow · commit b9bc0b9d04c8 · 2025-08-26T20:34:22.000+07:00
Fix KiKaraage/ZenMods#30
diff --git a/themes/1e86cf37-a127-4f24-b919-d265b5ce29a0/chrome.css b/themes/1e86cf37-a127-4f24-b919-d265b5ce29a0/chrome.css
@@ -131,16 +131,24 @@
   
   /* Set lighter opacity for passive extension buttons */
   .unified-extensions-item-icon {
-    opacity: 0.3;
+    opacity: 0.6;
   }
   .unified-extensions-item-action-button:hover {
-    background-color: color-mix(in srgb, currentColor 3%, transparent) !important;
+    background-color: color-mix(in srgb, currentColor 20%, transparent) !important;
   }
 
   #unified-extensions-view toolbarseparator {
     margin-top: 0px !important;
   }
 }
+/* Invert the passive extension icons in dark mode */
+@media (prefers-color-scheme: dark) {
+  @media (-moz-bool-pref: "mod.extension.viewgrid") {
+    .unified-extensions-item-icon {
+      filter: invert(1) !important;
+    }
+  }
+}
 
 /* 2 - Hide Zoom button in URL bar */
 @media (-moz-bool-pref: "mod.lean.hide-zoom") {

Original file line number	Diff line number	Diff line change
`@@ -131,16 +131,24 @@`
`131`	`131`
`132`	`132`	`/* Set lighter opacity for passive extension buttons */`
`133`	`133`	`.unified-extensions-item-icon {`
`134`		`- opacity: 0.3;`
	`134`	`+ opacity: 0.6;`
`135`	`135`	`}`
`136`	`136`	`.unified-extensions-item-action-button:hover {`
`137`		`- background-color: color-mix(in srgb, currentColor 3%, transparent) !important;`
	`137`	`+ background-color: color-mix(in srgb, currentColor 20%, transparent) !important;`
`138`	`138`	`}`
`139`	`139`
`140`	`140`	`#unified-extensions-view toolbarseparator {`
`141`	`141`	`margin-top: 0px !important;`
`142`	`142`	`}`
`143`	`143`	`}`
	`144`	`+/* Invert the passive extension icons in dark mode */`
	`145`	`+@media (prefers-color-scheme: dark) {`
	`146`	`+ @media (-moz-bool-pref: "mod.extension.viewgrid") {`
	`147`	`+ .unified-extensions-item-icon {`
	`148`	`+ filter: invert(1) !important;`
	`149`	`+ }`
	`150`	`+ }`
	`151`	`+}`
`144`	`152`
`145`	`153`	`/* 2 - Hide Zoom button in URL bar */`
`146`	`154`	`@media (-moz-bool-pref: "mod.lean.hide-zoom") {`