Fix: One Liner - Responsive with tabs on bottom

src/tabbar/_index.scss

@@ -20,7 +20,9 @@
 }
 
 @include Option("userChrome.tab.on_bottom") {
-  @import "tabs_on_bottom";
+  @include OneLinerOnBottom {
+    @import "tabs_on_bottom";
+  }
 }
 
 /*= Tab Bar - Oneliner =======================================================*/
@@ -30,9 +32,7 @@
 
 /*= Tab Bar - Shared Layout ==================================================*/
 @include Option("userChrome.tab.on_bottom", "userChrome.tab.one_liner") {
-  @include OneLinerContent {
-    @import "layout";
-  }
+  @import "layout";
 }
 
 /*= Tab Bar - Show only current tab ==========================================*/

src/tabbar/_layout.scss

@@ -1,5 +1,28 @@
 @include Option("userChrome.tab.on_bottom", "userChrome.tab.one_liner.tabbar_first") {
-  @import "layout/window_control";
+}
+@include NotOption("userChrome.tab.one_liner") {
+  @include Option("userChrome.tab.on_bottom") {
+    @import "layout/window_control";
+  }
+}
+@include Option("userChrome.tab.one_liner") {
+  @include NotOption("userChrome.tab.one_liner.responsive") {
+    @include Option("userChrome.tab.one_liner.tabbar_first") {
+      @import "layout/window_control";
+    }
+  }
+  @include Option("userChrome.tab.one_liner.responsive") {
+    @include Option("userChrome.tab.on_bottom") {
+      @media screen and (max-width: 1100px) {
+        @import "layout/window_control";
+      }
+    }
+    @include Option("userChrome.tab.one_liner.tabbar_first") {
+      @media screen and (min-width: 1100px) {
+        @import "layout/window_control";
+      }
+    }
+  }
 }
 
 @import "layout/navbar_padding";

src/tabbar/_tabs_on_bottom.scss

@@ -2,7 +2,7 @@
 See the above repository for updates as well as full license text. */
 
 /*= Tabbar - Move to bottom ==================================================*/
-#titlebar{
+#titlebar {
   order: 2; /* When userChrome.fullscreen.overlap */
   -moz-box-ordinal-group: 2;
   --tabs-navbar-shadow-size: 0px;

src/tabbar/layout/_navbar_padding.scss

@@ -13,18 +13,45 @@
 :root:is([tabsintitlebar][sizemode="maximized"], [sizemode="fullscreen"]) {
   --uc-window-drag-space-pre: 0px; /* Remove pre space */
 }
-@include Option("userChrome.tab.one_liner") {
-  @include NotOption("userChrome.tab.one_liner.tabbar_first") {
-    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-      /* Don't need window control */
-      --uc-window-control-width: 0px;
-      --uc-window-drag-space-post: 0px;
-    }
-  }
+
+//-- Mixin ---------------------------------------------------------------------
+@mixin _remove_spacer_pre() {
+  /* Don't need pre spacer */
+  --uc-window-drag-space-pre: 0px;
+}
+
+@mixin _remove_spacer_post() {
+  /* Don't need window control */
+  --uc-window-control-width: 0px;
+  --uc-window-drag-space-post: 0px;
+}
+
+@mixin _remove_spacer_oneLiner() {
   @include Option("userChrome.tab.one_liner.tabbar_first") {
-    :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
-      /* Don't need pre spacer */
-      --uc-window-drag-space-pre: 0px;
+    @include _remove_spacer_pre;
+  }
+  @include NotOption("userChrome.tab.one_liner.tabbar_first") {
+    @include _remove_spacer_post;
+  }
+}
+
+//------------------------------------------------------------------------------
+
+@include Option("userChrome.tab.one_liner") {
+  :root:is([tabsintitlebar], [sizemode="fullscreen"]) {
+    @include NotOption("userChrome.tab.one_liner.responsive") {
+      @include _remove_spacer_oneLiner;
+    }
+    @include Option("userChrome.tab.one_liner.responsive") {
+      @media screen and (max-width: 1100px) {
+        @include NotOption("userChrome.tab.on_bottom") {
+          @include _remove_spacer_pre;
+          @include _remove_spacer_post;
+        }
+      }
+      @media screen and (min-width: 1100px) {
+        @include _remove_spacer_oneLiner;
+      }
     }
   }
 }

src/tabbar/layout/_window_control.scss

@@ -6,7 +6,7 @@ See the above repository for updates as well as full license text. */
 }
 
 @include OS($win) {
-  :root[sizemode="maximized"][tabsintitlebar]{
+  :root[sizemode="maximized"][tabsintitlebar] {
     --uc-titlebar-padding: 8px;
   }
 }
@@ -76,4 +76,3 @@ See the above repository for updates as well as full license text. */
 :root:not([chromehidden~="menubar"]) #toolbar-menubar:not([autohide="true"]) .titlebar-buttonbox-container {
   visibility: hidden;
 }
-

src/utils/_one_liner.scss

@@ -19,6 +19,19 @@
   }
 }
 
+@mixin OneLinerOnBottom() {
+  @include NotOption("userChrome.tab.one_liner") {
+    @content;
+  }
+  @include Option("userChrome.tab.one_liner") {
+    @include Option("userChrome.tab.one_liner.responsive") {
+      @media screen and (max-width: 1100px) {
+        @content;
+      }
+    }
+  }
+}
+
 @mixin OneLinerTabbar() {
   @include NotOption("userChrome.tab.one_liner.responsive") {
     @content;