From 47c5cc7ccb93fca97a8ef4d3ef54ff74fa79fb50 Mon Sep 17 00:00:00 2001
From: "mr. m" <mr.m@tuta.com>
Date: Thu, 26 Jun 2025 01:00:57 +0200
Subject: [PATCH] fix: Fixed lightweight themes being enabled by default and
 other small theme changes, b=no-bug, c=common, tabs, workspaces

---
 src/browser/app/profile/features/theme.inc    |  2 +-
 src/browser/themes/shared/zen-icons/icons.css |  2 +-
 src/zen/common/styles/zen-theme.css           | 13 ++++++++-----
 src/zen/tabs/zen-tabs/vertical-tabs.css       | 12 ++++++++----
 src/zen/workspaces/zen-gradient-generator.css |  4 +++-
 5 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/browser/app/profile/features/theme.inc b/src/browser/app/profile/features/theme.inc
index e0557405..38c93c01 100644
--- a/src/browser/app/profile/features/theme.inc
+++ b/src/browser/app/profile/features/theme.inc
@@ -22,4 +22,4 @@ pref('zen.theme.window.scheme', 'auto'); // auto, light, dark
 #endif
 
 // Light weight themes
-pref('zen.theme.disable-lightweight', false);
+pref('zen.theme.disable-lightweight', true);
diff --git a/src/browser/themes/shared/zen-icons/icons.css b/src/browser/themes/shared/zen-icons/icons.css
index b8df66f5..dcc8fb3a 100644
--- a/src/browser/themes/shared/zen-icons/icons.css
+++ b/src/browser/themes/shared/zen-icons/icons.css
@@ -759,7 +759,7 @@
   border-radius: var(--tab-border-radius);
 
   &:hover {
-    background: var(--toolbarbutton-active-background);
+    background: var(--toolbarbutton-hover-background);
   }
 
   & image {
diff --git a/src/zen/common/styles/zen-theme.css b/src/zen/common/styles/zen-theme.css
index 9d68440c..0fbc76a2 100644
--- a/src/zen/common/styles/zen-theme.css
+++ b/src/zen/common/styles/zen-theme.css
@@ -130,10 +130,16 @@
 
   --toolbarbutton-hover-background: color-mix(
     in srgb,
-    var(--zen-branding-bg-reverse) 10%,
-    transparent 90%
+    var(--zen-branding-bg-reverse) 5%,
+    transparent 95%
   );
 
+  --toolbarbutton-active-background: color-mix(
+    in srgb,
+    var(--zen-branding-bg-reverse) 7%,
+    transparent 93%
+  ) !important;
+
   --toolbar-color: light-dark(rgb(21, 20, 26, 0.7), rgb(251, 251, 254, 0.7)) !important;
 
   /* Other colors */
@@ -157,11 +163,8 @@
   --urlbar-margin-inline: 1px !important;
 
   --tab-icon-overlay-stroke: light-dark(white, black) !important;
-
   --tab-close-button-padding: 5px !important;
 
-  --toolbarbutton-active-background: var(--zen-toolbar-element-bg);
-
   --input-bgcolor: var(--zen-colors-tertiary) !important;
   --input-border-color: var(--zen-input-border-color) !important;
   --zen-themed-toolbar-bg-transparent: light-dark(var(--zen-branding-bg), #171717);
diff --git a/src/zen/tabs/zen-tabs/vertical-tabs.css b/src/zen/tabs/zen-tabs/vertical-tabs.css
index c27d3f41..c792f4e2 100644
--- a/src/zen/tabs/zen-tabs/vertical-tabs.css
+++ b/src/zen/tabs/zen-tabs/vertical-tabs.css
@@ -773,19 +773,23 @@
   }
 
   #zen-sidebar-foot-buttons {
-    & > .toolbarbutton-1 {
+    & > .toolbarbutton-1,
+    & .toolbarbutton-badge-stack {
       min-height: var(--tab-min-height);
       line-height: var(--tab-label-line-height);
       border-radius: var(--border-radius-medium);
       padding: 0 calc(var(--tab-inline-padding) - var(--tab-inner-inline-margin));
-      width: var(--tab-collapsed-background-width);
-      margin-inline: var(--tab-inner-inline-margin);
 
-      & .toolbarbutton-badge-stack {
+      &.toolbarbutton-badge-stack {
         justify-content: center;
         padding: 8px;
         width: var(--tab-collapsed-background-width);
       }
+
+      &.toolbarbutton-1 {
+        width: var(--tab-collapsed-background-width);
+        margin-inline: var(--tab-inner-inline-margin);
+      }
     }
   }
 
diff --git a/src/zen/workspaces/zen-gradient-generator.css b/src/zen/workspaces/zen-gradient-generator.css
index 20623c19..c1d5a004 100644
--- a/src/zen/workspaces/zen-gradient-generator.css
+++ b/src/zen/workspaces/zen-gradient-generator.css
@@ -91,6 +91,7 @@
   overflow: auto;
   scrollbar-width: none;
   scroll-behavior: smooth;
+  mask-image: linear-gradient(to right, transparent 0%, black 2.5%, black 97.5%, transparent 100%);
 
   & > hbox {
     justify-content: space-around;
@@ -103,6 +104,7 @@
       cursor: pointer;
       position: relative;
       transition: transform 0.1s;
+
       &::after {
         content: '';
         position: absolute;
@@ -110,7 +112,7 @@
         height: 100%;
         top: 0;
         left: 0;
-        outline: 2px solid var(--zen-toolbar-element-bg);
+        outline: 2px solid color-mix(in srgb, var(--zen-toolbar-element-bg) 80%, transparent 20%);
         border-radius: 50%;
         pointer-events: none;
         transition: transform 0.1s;