Merge pull request #1146 from rsiebertdev/create-theme-1085

Update theme `better-toolbar-margins` to 1.1.0

themes/b4332738-1824-4ab7-b32e-dfeda244bc00/chrome.css

@@ -1,22 +1,115 @@
-
 :root {
+    /* Adjust the outline to the outside of the tabs so they don't look smaller than buttons without it */
+    --tab-outline-offset: 0 !important;
+
     &:not([zen-single-toolbar="true"]) {
+        /* Adjust the toolbar height. */
         --zen-toolbar-height: calc(38px + var(--zen-element-separation) * 2) !important;
 
-.titlebar-button {
-            padding: calc(17px + var(--zen-element-separation)) !important;
+        /* Adjust window control size to be inline with the modified sidebar width. */
+        .titlebar-button {
+            padding: calc(16px + var(--zen-element-separation)) !important;
         }
     }
 
-&:not([zen-sidebar-expanded="true"]) {
+    &:not([zen-sidebar-expanded="true"]) {
+        /* Adjust the regular sidebar width */
         --tab-min-width: calc(36px + var(--zen-element-separation) * 2) !important;
+
+        /* Adjust the padding below the tab tray in the collapsed sidebar. */
+        #TabsToolbar-customization-target {
+            padding-bottom: calc(var(--zen-element-separation) * 1.5) !important;
+        }
+
+        /* Adjust the padding above the footer icons wrapper below the tab tray. */
+        #zen-sidebar-icons-wrapper {
+            padding-top: calc(var(--zen-element-separation) * 1.5) !important;
+        }
+
+        /* Fixes a bug where the navbar is 1px shorter than it should be. */
+        #nav-bar {
+            margin-bottom: 0 !important; /* Remove the original fix. */
+            margin-top: 1px !important;
+        }
     }
 
-&[zen-right-side="true"] #zen-sidebar-top-buttons .titlebar-buttonbox-container {
+    &[zen-right-side="true"] #zen-sidebar-top-buttons .titlebar-buttonbox-container {
+        /* Remove the top margin that prevents the window control icons from being centered. */
         margin-top: 0 !important;
+
+        /* Keep the window control height inline with the toolbar height. */
+        height: var(--zen-toolbar-height) !important;
+    }
+
+    /* Adjust the compact sidebar width */
+    &[zen-compact-mode="true"]:not([customizing]):not([inDOMFullscreen="true"]) {
+        @media (-moz-bool-pref: "zen.view.compact.hide-tabbar"), (-moz-bool-pref: "zen.view.use-single-toolbar") {
+            #navigator-toolbox {
+                --zen-toolbox-max-width: calc(64px + var(--zen-element-separation)) !important;
+            }
+        }
     }
 }
 
+/* Adjust tab tray containers top margin to prevent clipping. */
+#tabbrowser-tabs {
+    margin-top: 0 !important;
+}
+
+[zen-sidebar-expanded="true"] #tabbrowser-tabs {
+    margin-top: -1px !important;
+}
+
+/* Adjust the padding of the standard sidebar containers. */
+#navigator-toolbox, :root:not([zen-compact-mode="true"]) #TabsToolbar {
+    padding-bottom: var(--zen-element-separation) !important;
+}
+
+/* Adjust the padding of the compact sidebar container. */
+#browser {
+    --zen-toolbox-padding: calc(var(--zen-element-separation) * 1.5) !important;
+}
+
+/* Adjust the padding below the tab tray in the expanded sidebar. */
+#TabsToolbar-customization-target {
+    padding-bottom: var(--zen-element-separation) !important;
+}
+
+/* Adjust the margin of the new-tab button to match tab margins. */
+#navigator-toolbox:not([zen-sidebar-expanded="true"]) #tabbrowser-arrowscrollbox-periphery > toolbarbutton {
+    margin: auto !important;
+    margin-block: var(--tab-block-margin) !important;
+}
+
+/* Adjust the gap between sidebar footer icons. */
+#zen-sidebar-icons-wrapper {
+    padding-top: calc(var(--zen-element-separation) * 2) !important;
+    gap: var(--zen-element-separation) !important;
+}
+
+#zen-essentials-container {
+    /* Remove the fixed gap inside the essential tabs container to match the sidebar tabs tray
+       by relying on tab-block-margin. */
+    gap: 0 !important;
+}
+
+.tabbrowser-tab {
+    /* Remove redundant min-width that breaks the center alignment within the compact sidebar. */
+    min-width: auto !important;
+
+    /* Adjust the outlines of 'essential' tabs inside the 'essentials' container. */
+    &[visuallyselected] {
+        @media (-moz-bool-pref: "zen.theme.essentials-favicon-bg") {
+            .tab-background::before {
+                /* Reduce by 1px to be inline with the modified tab-outline-offset. */
+                margin: 1px !important;
+                border-radius: var(--border-radius-medium) !important;
+            }
+        }
+    }
+}
+
+/* Ensure the window control icons are always centered. */
 .titlebar-button {
     align-items: center !important;
 }

themes/b4332738-1824-4ab7-b32e-dfeda244bc00/readme.md

@@ -1,6 +1,7 @@
-
 # Better Toolbar Margins
-By default, the toolbar margins in Zen Browser are very tight. This mod improves both the toolbar and sidebar margins.
-Unlike other mods, this one has been extensively tested and works with any layout.
+Zen Browser uses very tight margins. This mod improves both the toolbar and sidebar margins, and fixes various other margins.
+Unlike other mods, this has been extensively tested and aims to work with any layout.
+
+Made with 💖 by Roman.
 
 > Mods may break in later versions. I use these mods myself, and keep them up-to-date with the latest versions of Zen. If something doesn't work as intended, feel free to [reach out](mailto:roman@rsiebert.dev).

themes/b4332738-1824-4ab7-b32e-dfeda244bc00/theme.json

@@ -1,14 +1,14 @@
 {
     "id": "b4332738-1824-4ab7-b32e-dfeda244bc00",
     "name": "Better Toolbar Margins",
-    "description": "This mod has been extensively tested, and improves the margins on both the toolbar and sidebar.",
+    "description": "This mod improves both the toolbar and sidebar margins, and fixes various other margins in Zen.",
     "homepage": "",
     "style": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/b4332738-1824-4ab7-b32e-dfeda244bc00/chrome.css",
     "readme": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/b4332738-1824-4ab7-b32e-dfeda244bc00/readme.md",
     "image": "https://raw.githubusercontent.com/zen-browser/theme-store/main/themes/b4332738-1824-4ab7-b32e-dfeda244bc00/image.png",
     "author": "rsiebertdev",
-    "version": "1.0.0",
+    "version": "1.1.0",
     "tags": [],
     "createdAt": "2025-02-17",
-    "updatedAt": "2025-02-17"
-}
+    "updatedAt": "2025-02-25"
+}