From 2398173715dc7da52b087bd57c5d9f33fabc1f3c Mon Sep 17 00:00:00 2001
From: suchacat <157089688+suchacat@users.noreply.github.com>
Date: Fri, 24 May 2024 20:13:05 -0400
Subject: [PATCH 1/2] Update userChrome.css

Updated url bar in Tab and click selected tab to focus url bar, which fixes the issue of not being able to click other tabs whether you are focused on the tab or not and removed the text that appears when clicking the search bar.
---
 chrome/userChrome.css | 237 +++++++++++++++++++++++++++++-------------
 1 file changed, 165 insertions(+), 72 deletions(-)

diff --git a/chrome/userChrome.css b/chrome/userChrome.css
index 0fe78d6..bf85578 100644
--- a/chrome/userChrome.css
+++ b/chrome/userChrome.css
@@ -3,10 +3,11 @@
 :root {
   --6: 6px;
   --8: 8px;
-  --tab-min-height: 24px !important;
-  --tab-min-width: 24px !important;
-  --toolbarbutton-border-radius: var(--6) !important;
-  --tab-border-radius: var(--6) !important;
+  --tab-min-height: 28px !important;
+  --tab-min-width: 28px !important;
+  --toolbarbutton-border-radius: var(--8) !important;
+  --tab-border-radius: var(--8) !important;#TabsToolbar {
+  }
   --main: #77777770;
   --item: #77777730;
   --grey: #b8b8b8;
@@ -354,104 +355,188 @@ tab:not([pinned]):hover .tab-close-button {
 /* 📐 URLBAR in Tab */
 /* Source: https://github.com/MrOtherGuy/firefox-csshacks/.../selected_tab_as_urlbar.css */
 
-#main-window > body > box {
-  position: relative;
-  z-index: 1;
-}
-.urlbar-input-box {
-  z-index: -1 !important;
-}
+/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/selected_tab_as_urlbar.css made available under Mozilla Public License v. 2.0
+See the above repository for updates as well as full license text. */
+
+/* This is a horrible hack and absolutely requires click_selected_tab_to_focus_urlbar.css to work. In general it's pertty bad, but meh */
+
+/* Also hides the nav-bar and shows main menu button next to window controls. And makes the selected tab expand a whole bunch  */
+
+/* Whole bunch of z-indexing */
+#main-window > body > box{ position: relative; z-index: 1 }
+.urlbar-input-box{ z-index: -1 !important; }
+#urlbar{ z-index: auto !important; }
 #alltabs-button,
 #unified-extensions-button,
 #PanelUI-button,
-#nav-bar-overflow-button {
-  z-index: 2;
-  position: relative;
+#nav-bar-overflow-button{ z-index: 2; position: relative }
+
+#urlbar-input-container{
+  width: calc(100vw - var(--uc-window-control-width) - var(--uc-buttons-width) - 2 * var(--uc-window-drag-space-width) - 76px) !important;
+  left: calc(76px + var(--uc-window-drag-space-width)) !important;
+  pointer-events: none;
+  overflow: visible !important;
 }
-#urlbar-input-container > :not(.urlbar-input-box) {
-  opacity: 0;
+:root:not([customizing]) #urlbar-input-container::before{
+  position: absolute;
+  left: 0;
+  top: 0 !important;
+  height: var(--urlbar-container-height);
 }
-#urlbar-background {
-  background: none !important;
+#urlbar-input-container > :not(.urlbar-input-box){ opacity: 0 }
+
+#urlbar-background{
+  background: transparent !important;
+  border: none !important;
+  box-shadow: none !important;
+  outline: none !important;
 }
-#urlbar-container {
+#urlbar{pointer-events: none !important;}
+#urlbar-container{
   position: static !important;
+  margin-left: var(--uc-window-control-width) !important;
 }
-.urlbarView {
-  background: var(--item);
+#remote-control-box,
+#urlbar-search-button{
+  display: none;
+}
+#tracking-protection-icon-container,
+#identity-box{
+  max-width: 0.1px;
+  padding-inline: 0 !important;
+}
+.urlbarView{
+  background: var(--toolbar-field-focus-background-color);
+  border: 1px solid var(--toolbar-field-focus-border-color) !important;
   z-index: 1;
-  padding: var(--6);
-  border-radius: var(--6);
-  left: 50vw;
-  width: max(50vw, 320px) !important;
+  padding: 6px;
+  border-radius: 6px;
+  box-shadow: 0 0 26px #444;
+  left:50vw;
+  width: max(70vw,600px) !important;
   transform: translateX(-50%) !important;
 }
-#nav-bar {
-  height: var(--tab-min-height) !important;
-  background-color: transparent !important;
+
+.tabbrowser-tab[selected][fadein]{
+  max-width: 100vw !important;
+  min-width: 200px !important;
+  flex-grow: 300 !important;
+}
+
+#navigator-toolbox:focus-within .tabbrowser-tab[selected] .tab-content{
+  opacity: 0;
+}
+#navigator-toolbox:focus-within .tab-background[selected]{
+  background-image: -moz-element(#urlbar-input) !important;
+  background-position: calc(var(--tab-inline-padding,4px) + 6px) 3px !important;
+  background-color: var(--toolbar-field-focus-background-color) !important;
+  background-size: auto !important;
 }
 
-/* 📐 Click Tab to Focus Urlbar */
-/* Source: https://github.com/MrOtherGuy/firefox-csshacks/.../click_selected_tab_to_focus_urlbar.css*/
+:root:not([customizing]) #titlebar{ margin-bottom: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin)); }
 
-/* Make selected tab unclickable => click > capture box */
-.tabbrowser-tab:not([pinned])[selected] {
-  pointer-events: none;
+/* Oh and! also hide other buttons from the nav-bar because why not */
+:root:not([customizing]) #nav-bar-customization-target > :not(#urlbar-container){ visibility: collapse }
+#TabsToolbar > .toolbar-items{
+  margin-right: 112px !important; /* This is space on right side for 3 buttons, menu, overflow and addons */
+  margin-left: 80px !important;
 }
+#unified-extensions-button{
+  visibility: visible !important;
+}
+#back-button, #forward-button{
+  order: -1;
+  z-index: 2;
+  visibility: visible !important;
+}
+
+/* By default this style moves your back and forward buttons to the left edge of the navbar and adds a placeholder space for them.
+   Set the following pref to false to disable that behavior */
+@media (-moz-bool-pref: "userchrome.selected-tab-as-urlbar.nav-buttons-space.disabled"){
+  #TabsToolbar > .toolbar-items{ margin-left: 0px !important; }
+  #nav-bar-customization-target{ margin-left: 0px !important; }
+  #back-button, #forward-button{
+    order: auto;
+    z-index: auto;
+  }
+} 
+ 
+#nav-bar{ 
+  height: calc(var(--tab-min-height) + 2*var(--tab-block-margin));
+  box-shadow: none !important;
+  background-color: transparent !important;
+}
+#titlebar:has(> [autohide="true"]) + #nav-bar{
+  padding-right: calc(138px + 40px);
+}
+
+/* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/click_selected_tab_to_focus_urlbar.css made available under Mozilla Public License v. 2.0
+See the above repository for updates as well as full license text. */
+
+/* Clicking selected tab selects focuses urlbar */
+/* Selected tab cannot be normally clicked (right-,middle- or left-clicked) EXCEPT from the tab icon */
 
-/* Retore pointer-events for usability */
+/* Clicking selected pinned tab doesn't focus urlbar by default since I expect you might not want to change pinned tab address - see below */
+
+
+/* Make selected tab unclickable so click goes to the capture box, obviously it can't be clicked at all anymore */
+/* remove the :not([pinned]) bit to make clicking pinned tab AROUND the tab-icon focus urlbar*/
+
+.tabbrowser-tab:not([pinned])[selected]{ pointer-events: none }
+
+:root{
+  --uc-window-control-width: 138px;
+  --uc-buttons-width: 116px;
+  --uc-window-drag-space-width: 40px;
+  --uc-menubar-height: 0px;
+}
+@media (-moz-platform: windows),
+       (-moz-platform: linux){
+  :root:is([sizemode="maximized"],[sizemode="fullscreen"]){
+    --uc-window-drag-space-width: 0px;
+  }
+  #titlebar:has(> [autohide="false"]) + #nav-bar{
+    --uc-window-drag-space-width: 0px;
+    --uc-menubar-height: 28px;
+  }
+}
+/* Add back pointer-events to several elements so UI remains usable */
+/* The selected tab can be clicked normally from the icon */
 #TabsToolbar toolbarbutton,
 #TabsToolbar toolbaritem,
 .tabbrowser-tab,
 .tab-close-button,
-.tab-icon-stack {
-  pointer-events: auto;
+.tab-icon-stack{
+  pointer-events: auto
 }
-
-/* Capture box: click to focus urlbar */
-:root:not([customizing]) #urlbar-input-container::before {
+/* Invisible capture box behind tabs*/
+:root:not([customizing]) #urlbar-input-container::before{
   position: fixed;
-  display: flex;
-  flex: 1;
-  height: var(--tab-min-height);
-  width: 100%;
-  top: var(--8);
-  bottom: var(--8);
+  display: block;
+  left: 0;
+  top: var(--uc-menubar-height);
+  width: var(--uc-buttons-width);
+  height: calc(var(--tab-min-height) + 2*var(--tab-block-margin));
   content: "";
+  pointer-events: auto;
 }
-#urlbar-input-container:focus-within::before {
-  display: none !important;
+:root[tabsintitlebar]:not([customizing]) #urlbar-input-container::before{
+  left: var(--uc-window-drag-space-width);
+  width: calc(100vw - var(--uc-window-control-width) - var(--uc-buttons-width) - 2 * var(--uc-window-drag-space-width));
 }
+#urlbar-input-container:focus-within::before{ display: none !important; }
 
-/* Tabs over the capture box */
-:root:not([customizing]) #TabsToolbar-customization-target {
+/* Make tabs appear over the invisible box */
+:root:not([customizing]) #TabsToolbar-customization-target{
   position: relative;
   z-index: 1;
-  pointer-events: none;
+  pointer-events: none
 }
-
-/* Tab Focus => Url Select */
-#navigator-toolbox:focus-within
-  .tabbrowser-tab:not([pinned])[selected]
-  .tab-content {
-  opacity: 0;
-}
-
-/* Tab URL */
-#navigator-toolbox:focus-within .tab-background:not([pinned])[selected] {
-  background-position: var(--6) !important;
-  background-color: var(--main) !important;
-  background-size: auto !important;
-  background-image: -moz-element(#urlbar-input) !important;
+#titlebar{
+  opacity: 1 !important;
+  will-change: unset !important;
+  transition: none !important;
 }
-
-/* 🪟 Drag Window from urlbar */
-.urlbar-input-box,
-#urlbar-input,
-#urlbar-scheme,
-#urlbar-container {
-  -moz-window-dragging: drag;
-  cursor: default;
 }
 
 /* ⬇️ Downloads Indicator */
@@ -515,3 +600,11 @@ tab:not([pinned]):hover .tab-close-button {
   margin-inline-end: var(--8) !important;
 }
 
+/* Search Suggestions Fix*/
+#urlbar-container #urlbar-input-container {
+  opacity: 0;
+}
+.urlbarView {
+  background-color: var(--lwt-accent-color); /* Pop-up background color (adaptive) */
+  color: grey;                               /* Pop-up text color */
+

From 12daa88b62c3ecdd5399584867499f0e1c63f4c1 Mon Sep 17 00:00:00 2001
From: suchacat <157089688+suchacat@users.noreply.github.com>
Date: Sun, 26 May 2024 01:57:43 -0400
Subject: [PATCH 2/2] Update userChrome.css

Fixed the download button not being able to be clicked
---
 chrome/userChrome.css | 27 +++++++++++++++++++--------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/chrome/userChrome.css b/chrome/userChrome.css
index bf85578..ff01e2f 100644
--- a/chrome/userChrome.css
+++ b/chrome/userChrome.css
@@ -343,7 +343,7 @@ tab:not([pinned]):hover .tab-close-button {
 
 
 
-/* 🔗 URLBAR Inbut https: */
+/* 🔗 URLBAR Input https: */
 #urlbar-input {
   transition: transform 0.1s linear;
   transform: none !important;
@@ -352,8 +352,9 @@ tab:not([pinned]):hover .tab-close-button {
   padding-inline: 0px !important;
 }
 
+
+
 /* 📐 URLBAR in Tab */
-/* Source: https://github.com/MrOtherGuy/firefox-csshacks/.../selected_tab_as_urlbar.css */
 
 /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/selected_tab_as_urlbar.css made available under Mozilla Public License v. 2.0
 See the above repository for updates as well as full license text. */
@@ -441,6 +442,15 @@ See the above repository for updates as well as full license text. */
   margin-right: 112px !important; /* This is space on right side for 3 buttons, menu, overflow and addons */
   margin-left: 80px !important;
 }
+
+#downloads-button {
+  visibility: visible !important;
+}
+
+#urlbar-input {
+  text-align: center;
+}
+
 #unified-extensions-button{
   visibility: visible !important;
 }
@@ -537,13 +547,13 @@ See the above repository for updates as well as full license text. */
   will-change: unset !important;
   transition: none !important;
 }
-}
+
 
 /* ⬇️ Downloads Indicator */
 #downloads-button {
-  position: fixed !important;
-  top: 0 !important;
-  right: 0 !important;
+  position: fixed ;
+  top: 0;
+  right: 0;
   width: var(--tab-min-height);
   z-index: 1;
 }
@@ -577,6 +587,7 @@ See the above repository for updates as well as full license text. */
 #downloadsPanel {
   position: fixed !important;
   margin: 4px var(--6) !important;
+  border-radius: var(--6) !important;
 }
 #downloadsPanel-mainView {
   background-color: var(--grey) !important;
@@ -606,5 +617,5 @@ See the above repository for updates as well as full license text. */
 }
 .urlbarView {
   background-color: var(--lwt-accent-color); /* Pop-up background color (adaptive) */
-  color: grey;                               /* Pop-up text color */
-
+  color: grey;    
+                           }                           /* Pop-up text color */