Fixed web aligment issues on certain occations and URL bar not showing in compact mode right side

.dockerignore

@@ -0,0 +1,5 @@
+node_modules
+.git
+.DS_Store
+*.log
+engine

src/browser/base/content/ZenUIManager.mjs

@@ -300,7 +300,7 @@ var gZenVerticalTabsManager = {
       let shouldHide = false;
       if (((!isRightSide && this.isWindowsStyledButtons) || (isRightSide && !this.isWindowsStyledButtons)
         || (
-          isCompactMode && isSingleToolbar && this.isWindowsStyledButtons && !isRightSide
+          isCompactMode && isSingleToolbar && this.isWindowsStyledButtons
         )) && isSingleToolbar) {
         appContentNavbarContaienr.setAttribute('should-hide', 'true');
         shouldHide = true;
@@ -415,7 +415,7 @@ var gZenVerticalTabsManager = {
         }
       }
 
-      if (shouldHide && !isCompactMode) {
+      if (shouldHide) {
         appContentNavbarContaienr.append(windowButtons);
       }
 

src/browser/base/content/zen-styles/zen-compact-mode.css

@@ -12,9 +12,11 @@
 
     @media (-moz-bool-pref: 'zen.view.compact.hide-tabbar') or (-moz-bool-pref: 'zen.view.use-single-toolbar') {
       #zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel[pinned='true']) {
-        margin-left: calc(var(--zen-sidebar-web-panel-spacing) * 2) !important;
+        margin-left: var(--zen-sidebar-web-panel-spacing) !important;
       }
 
+      #urlbar[open]
+
       #zen-appcontent-wrapper {
         margin-left: var(--zen-element-separation) !important;
       }
@@ -34,7 +36,8 @@
         &:not([animate='true']) {
           position: absolute;
           z-index: 10;
-          transition: transform 0.25s ease, opacity 0.1s ease-in-out;
+          transition: transform 0.25s ease, opacity 1s ease;
+          transform: translateX(0);
           top: 0;
           bottom: var(--zen-element-separation);
           opacity: 0;
@@ -112,6 +115,7 @@
       #mainPopupSet:has(> #appMenu-popup:hover) ~ toolbox,
       #navigator-toolbox:has(.tabbrowser-tab:active),
       #navigator-toolbox:has(*[open='true']:not(tab):not(.zen-compact-mode-ignore)) {
+        transition: transform 0.25s ease;
         opacity: 1;
 
         transform: translateX(calc(100% - var(--zen-element-separation) - 1px));

src/browser/base/content/zen-styles/zen-sidebar-panels.css

@@ -281,11 +281,18 @@
   animation: better-sidebar-pinned-hide 0.15s ease-in-out forwards !important;
 }
 
-:root:not([zen-right-side='true']) {
+#zen-sidebar-web-panel-wrapper:has(#zen-sidebar-web-panel:not(:is([hidden='true']))) {
-  #zen-sidebar-web-panel-wrapper:not(:has(#zen-sidebar-web-panel:is([hidden='true'], [pinned='true']))) {
+  :root:not([zen-right-side='true']) & {
     margin-left: 0 !important;
     margin-right: calc(var(--zen-element-separation) * 2 - 3px) !important;
   }
+
+  @media (-moz-bool-pref: 'zen.view.compact') and (-moz-bool-pref: 'zen.view.compact.hide-tabbar') {
+    :root[zen-right-side='true'] & {
+      margin-left: 0 !important;
+      margin-right: calc(var(--zen-element-separation) * 2 - 3px) !important;
+    }
+  }
 }
 
 /** UNPINNED **/

src/browser/base/content/zen-styles/zen-tabs/vertical-tabs.css

@@ -372,7 +372,6 @@
 
     :root[zen-single-toolbar='true'] & {
       margin-left: var(--zen-toolbox-padding);
-      width: calc(100% - var(--zen-toolbox-padding));
       & #urlbar:not([breakout-extend='true']) .urlbar-input-container {
         padding-left: 4px;
         padding-right: 4px;
@@ -380,7 +379,6 @@
 
       :root[zen-right-side='true'] & {
         margin-left: 0;
-        margin-right: var(--zen-toolbox-padding);
       }
     }
   }

src/browser/base/content/zen-styles/zen-urlbar.css

@@ -372,13 +372,17 @@ button.popup-notification-dropmarker {
     margin-right: var(--urlbar-margin-inline);
   }
 
-  :root[zen-right-side='true'] & {
-    right: 0;
-  }
   position: absolute;
 
   top: calc(var(--zen-toolbar-height) * 2) !important;
-  left: 28vw;
+
+  :root[zen-right-side='true'] & {
+    right: 28vw !important;
+  }
+
+  :root:not([zen-right-side='true']) & {
+    left: 28vw !important;
+  }
 
   #urlbar-container:has(&) {
     border-radius: 10px;