From 4dfb9879ba4c5a4e36d59ad54e11752922654548 Mon Sep 17 00:00:00 2001
From: Mauro Balades <mauro.balades@tutanota.com>
Date: Thu, 4 Jul 2024 14:53:21 +0200
Subject: [PATCH] chore: Update CSS styles for Zen Browser sidebar and
 tabpanels

---
 src/browser/themes/shared/zen-decks.css             |  2 +-
 src/browser/themes/shared/zen-sidebar.css           | 13 +++++++++++--
 src/toolkit/content/zen-xul.css                     |  2 +-
 .../themes/shared/in-content/zen-common-shared.css  |  4 ++--
 4 files changed, 15 insertions(+), 6 deletions(-)

diff --git a/src/browser/themes/shared/zen-decks.css b/src/browser/themes/shared/zen-decks.css
index 7d0a967b4..3b8ced151 100644
--- a/src/browser/themes/shared/zen-decks.css
+++ b/src/browser/themes/shared/zen-decks.css
@@ -21,7 +21,7 @@
 }
 
 #tabbrowser-tabpanels[zen-split-view="true"] .browserSidebarContainer[zen-split-active="true"] {
-  border-color: var(--zen-primary-color) !important;
+  box-shadow: 0 0 0 2px var(--zen-primary-color) !important;
 }
 
 #tabbrowser-tabpanels:has(> [zen-split="true"]) {
diff --git a/src/browser/themes/shared/zen-sidebar.css b/src/browser/themes/shared/zen-sidebar.css
index e68bbb73f..0d6ccad14 100644
--- a/src/browser/themes/shared/zen-sidebar.css
+++ b/src/browser/themes/shared/zen-sidebar.css
@@ -13,8 +13,9 @@
   overflow: hidden;
   transition: .2s;
   margin-left: 0 !important;
-  margin-right: 0 !important;
   border: var(--zen-appcontent-border);
+  margin-top: 0 !important;
+  box-shadow: none;
 }   
 
 #sidebar-box[hidden="true"] {
@@ -22,6 +23,14 @@
   opacity: 0 !important;
 }
 
+#sidebar-box[positionend="true"] {
+  order: 1 !important;
+}
+
+#sidebar-box:not([positionend   ="true"]) {
+  margin-right: 0 !important;
+}
+
 #zen-main-app-wrapper:has(#sidebar-box:not([hidden="true"], [positionend="true"])) #TabsToolbar {
   margin-right: 0 !important;
   box-shadow: none !important;
@@ -32,7 +41,7 @@
   background: transparent !important;  
   border-color: transparent !important;
   width: 1px !important;
-  margin-right: 5px !important   ;
+  margin-right: 5px !important;
 }
 
 #sidebar-box[positionend] {
diff --git a/src/toolkit/content/zen-xul.css b/src/toolkit/content/zen-xul.css
index 5db8dc1eb..aefc4adf2 100644
--- a/src/toolkit/content/zen-xul.css
+++ b/src/toolkit/content/zen-xul.css
@@ -6,7 +6,7 @@
   --zen-appcontent-separator-from-window-single: 7px;
   --zen-appcontent-separator-from-window: var(--zen-appcontent-separator-from-window-single);
   --zen-appcontent-border-radius: var(--zen-panel-radius);
-  --zen-appcontent-border: 2px solid var(--zen-colors-border);
+  --zen-appcontent-border: 1px solid var(--zen-colors-border);
   --zen-browser-border-radius: var(--zen-panel-radius);
 }
 
diff --git a/src/toolkit/themes/shared/in-content/zen-common-shared.css b/src/toolkit/themes/shared/in-content/zen-common-shared.css
index 0a4f59d4f..448db8739 100644
--- a/src/toolkit/themes/shared/in-content/zen-common-shared.css
+++ b/src/toolkit/themes/shared/in-content/zen-common-shared.css
@@ -25,7 +25,7 @@
 
   --zen-colors-hover-bg: color-mix(in srgb, var(--zen-primary-color) 90%, white 10%);
   --zen-colors-primary-foreground: color-mix(in srgb, var(--zen-primary-color) 80%, black 20%);
-  --zen-colors-border: color-mix(in srgb, var(--zen-colors-secondary) 90%, black 10%);
+  --zen-colors-border: color-mix(in srgb, var(--zen-colors-secondary) 70%, black 30%);
 
   --zen-colors-input-bg: color-mix(in srgb, var(--zen-primary-color) 10%, white 80%);
 
@@ -95,7 +95,7 @@
     --zen-colors-primary-foreground: color-mix(in srgb, var(--zen-primary-color) 80%, white 20%);
   
     --zen-colors-input-bg: color-mix(in srgb, var(--zen-primary-color) 10%, black 80%);
-    --zen-colors-border: color-mix(in srgb, var(--zen-colors-secondary) 70%, black 30%);
+    --zen-colors-border: color-mix(in srgb, var(--zen-colors-secondary) 80%, black 20%);
   
     --zen-dialog-background: color-mix(in srgb, var(--zen-primary-color) 10%, black 90%);
     --zen-urlbar-background: color-mix(in srgb, var(--zen-primary-color) 8%, black 92%);