firefox tab style changes for vertical tabs

5 files changed, 79 insertions, 40 deletions

diff --git a/modules/firefox.home/chrome/globalKeybindings.uc.js b/modules/firefox.home/chrome/globalKeybindings.uc.js
index cd6a420..0544bb8 100644
--- a/modules/firefox.home/chrome/globalKeybindings.uc.js
+++ b/modules/firefox.home/chrome/globalKeybindings.uc.js
@@ -43,23 +43,28 @@
   const togglePassthrough = () => () => UC.globalKeybindings.updateMode(m => m !== MODE_PASSTHRU ? MODE_PASSTHRU : MODE_NORMAL)
 
   const sidetabs = {
-    getExtensionId: () => {
-      return [...SidebarController.sidebars].find(([_, p]) => p.label?.match(/sidetabs/i))?.[0];
-    },
+    // getExtensionId: () => {
+    //   return [...SidebarController.sidebars].find(([_, p]) => p.label?.match(/sidetabs/i))?.[0];
+    // },
     ensureReady: async () => {
-      for (let i = 0; i < 3; i++) {
-        if (sidetabs.getExtensionId()) {
-          return !SidebarController.isOpen && SidebarController.show(sidetabs.getExtensionId() ?? undefined)
-        } else {
-          console.log('sidebar retry...');
-          await new Promise(res => setTimeout(res), 100);
-        }
-      }
+      // Hide sidebar
+      SidebarController.hide();
+      // Close by default
+      SidebarController.toggleExpanded(false);
+      // for (let i = 0; i < 3; i++) {
+      //   if (sidetabs.getExtensionId()) {
+      //     return !SidebarController.isOpen && SidebarController.show(sidetabs.getExtensionId() ?? undefined)
+      //   } else {
+      //     console.log('sidebar retry...');
+      //     await new Promise(res => setTimeout(res), 100);
+      //   }
+      // }
     },
     toggle: () => async () => {
-      await sidetabs.ensureReady();
-      const sidebar = document.getElementById('sidebar-box');
-      sidebar?.classList.toggle('open');
+      SidebarController.toggleExpanded();
+      // await sidetabs.ensureReady();
+      // const sidebar = document.getElementById('sidebar-box');
+      // sidebar?.classList.toggle('open');
     },
   }
 
diff --git a/modules/firefox.home/chrome/userChrome.css b/modules/firefox.home/chrome/userChrome.css
index 7b647f6..8e057df 100644
--- a/modules/firefox.home/chrome/userChrome.css
+++ b/modules/firefox.home/chrome/userChrome.css
@@ -101,11 +101,15 @@ toolbarbutton#alltabs-button {
 #nav-bar {
   border-top: none !important;
   background-color: var(--toolbar-bgcolor) !important;
-  padding: 4px 2px !important;
+  padding: 6px 2px 3px !important;
+}
+#TabsToolbar {
+  visibility: collapse !important;
 }
 
 #urlbar-container {
   min-height: var(--ff-urlbar-height) !important;
+  --urlbar-container-height: unset !important;
 }
 
 #urlbar {
@@ -123,6 +127,8 @@ toolbarbutton#alltabs-button {
   border-color: transparent !important;
   min-height: 0 !important;
   padding-inline: 0 !important;
+  padding-block: 0 !important;
+  height: var(--ff-urlbar-height) !important;
 }
 
 #urlbar[breakout-extend] .urlbar-input-container {
@@ -140,35 +146,21 @@ toolbarbutton#alltabs-button {
 
 
 /* Sidebar + tab */
-#TabsToolbar {
-	visibility: collapse !important;
-}
-#sidebar-header {
-	display: none !important;
-}
-#sidebar-splitter {
-  display: none !important;
+#sidebar-main {
+  background: var(--ff-bg-color) !important;
 }
 #sidebar-box {
- --sidebar-hover-width: 36px;
- display: grid !important;
- min-width: var(--sidebar-hover-width) !important;
- max-width: var(--sidebar-hover-width) !important;
- overflow: visible !important;
- height: 100% !important;
- min-height: 100% !important;
- max-height: 100% !important;
+  background: var(--ff-bg-color) !important;
+  margin: 3px 0 !important;
 }
 #sidebar {
- height: 100% !important;
- width: 100% !important;
- min-width: 0 !important;
+  background: var(--ff-bg-color-2) !important;
 }
-#sidebar-box.open {
- --sidebar-visible-width: 240px;
- width: var(--sidebar-visible-width) !important;
- min-width: var(--sidebar-visible-width) !important;
- max-width: var(--sidebar-visible-width) !important;
+
+#tabbrowser-tabbox {
+  border-radius: 6px !important;
+  overflow: hidden !important;
+  margin: 4px !important;
 }
 
 
@@ -228,4 +220,35 @@ toolbarbutton#alltabs-button {
 #main-window[privatebrowsingmode="temporary"] #browser {
   background-color: var(--ff-bg-private) !important;
 }
+#main-window[privatebrowsingmode="temporary"] #sidebar-main {
+  background: var(--ff-bg-private) !important;
+}
+#main-window[privatebrowsingmode="temporary"] #sidebar-box {
+  background: var(--ff-bg-private) !important;
+}
+
+
+/* Tab counter */
+#tabbrowser-tabs {
+  counter-reset: section;
+}
 
+.tabbrowser-tab::before {
+  counter-increment: section;
+  content: counter(section);
+  position: absolute;
+  left: 5px;
+  top: 50%;
+  transform: translateY(-50%);
+  font-weight: bolder;
+  z-index: 1;
+  width: 1rem;
+  height: 1rem;
+  font-size: 0.6rem;
+  background: var(--ff-bg-color);
+  border: 1px solid #555;
+  border-radius: 50%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
diff --git a/modules/firefox.home/default.nix b/modules/firefox.home/default.nix
index b0a7f71..6a84205 100644
--- a/modules/firefox.home/default.nix
+++ b/modules/firefox.home/default.nix
@@ -5,7 +5,7 @@ let
   extensions = [
     "https://addons.mozilla.org/firefox/downloads/file/3792127/firefox_dracula-1.0.xpi"
     "https://addons.mozilla.org/firefox/downloads/file/4261352/tridactyl_vim-1.24.1.xpi"
-    "https://addons.mozilla.org/firefox/downloads/file/4240798/sidetabs-0.66.xpi"
+    # "https://addons.mozilla.org/firefox/downloads/file/4240798/sidetabs-0.66.xpi"
     # "https://addons.mozilla.org/firefox/downloads/latest/ublock-origin/latest.xpi"
 
     # dev
diff --git a/modules/firefox.home/preferences.nix b/modules/firefox.home/preferences.nix
index 35572cb..762a960 100644
--- a/modules/firefox.home/preferences.nix
+++ b/modules/firefox.home/preferences.nix
@@ -7,6 +7,9 @@ in {
     "browser.startup.homepage" = homepage-url;
     "browser.newtab.url" = homepage-url;
 
+    "sidebar.verticalTabs" = true;
+    "sidebar.main.tools" = "";
+    "sidebar.visibility" = "always-show";
     "browser.startup.blankWindow" = false;
     "browser.tabs.drawInTitlebar" = true;
     "browser.uidensity" = 0;
diff --git a/modules/firefox.home/tridactyl/tridactylrc b/modules/firefox.home/tridactyl/tridactylrc
index 2fe7075..f3373a8 100644
--- a/modules/firefox.home/tridactyl/tridactylrc
+++ b/modules/firefox.home/tridactyl/tridactylrc
@@ -17,11 +17,19 @@ unbind tt
 unbind T
 unbind J
 unbind K
+unbind f
+unbind n
+unbind N
+unbind a
+unbind A
+unbind <C-f>
 
 bind o fillcmdline tabopen
 bind O fillcmdline open
 bind p clipboard tabopen
 bind P clipboard open
+bind n findnext
+bind N findprev
 
 bind --mode=normal J scrollpx 0 200
 bind --mode=normal K scrollpx 0 -200