[FB] Vertical Tab | Temporaly fix

Floorp-Projects · May 18, 2024 · d792878 · d792878
1 parent c8aaedc
commit d792878
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 45 deletions.
diff --git a/Floorp-private-components b/Floorp-private-components
diff --git a/browser/base/content/browser-verticaltabs.css b/browser/base/content/browser-verticaltabs.css
@@ -5,28 +5,28 @@
  */
 
 .toolbar-items {
-  height: 100%;
+  height: 100% !important;
 }
 
 #TabsToolbar {
-  max-width: 350px;
-  min-width: 150px;
-  transition :min-width 150ms ease-out, max-width 150ms ease-out;
-  overflow: hidden;
+  max-width: 350px !important;
+  min-width: 150px !important;
+  transition :min-width 150ms ease-out, max-width 150ms ease-out!important;
+  overflow: hidden!important;
 }
 
 #TabsToolbar:-moz-lwtheme {
-  background-image: var(--lwt-additional-images);
-  background-repeat: no-repeat;
-  background-position: center;
-  background-size: cover;
-  background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color));
+  background-image: var(--lwt-additional-images)!important;
+  background-repeat: no-repeat!important;
+  background-position: center!important;
+  background-size: cover!important;
+  background-color: var(--lwt-accent-color-inactive, var(--lwt-accent-color))!important;
 }
 
 .tabbrowser-tab {
-  max-width: unset;
-  width: 100%;
-  min-height: unset;
+  max-width: unset!important;
+  width: 100%!important;
+  min-height: unset!important;
   height: 40px !important;
   max-height: 40px !important;
   margin: 0 !important;
@@ -46,36 +46,36 @@
 }
 
 #TabsToolbar-customization-target {
-  height: 100%;
-  max-height: 100%;
-  min-height: 100%;
-  flex-direction: column;
+  height: 100% !important;
+  max-height: 100% !important;
+  min-height: 100% !important;
+  flex-direction: column !important;
 }
 
 #TabsToolbar-customization-target > .toolbarbutton-1  {
   display: inherit !important;
   appearance: inherit !important;
-  border-radius: 5px;
-  height: 25px;
-  margin: 5px;
+  border-radius: 5px !important;
+  height: 25px !important;
+  margin: 5px !important;
   padding: 0 !important;
-  justify-content: flex-start;
+  justify-content: flex-start!important;
 }
 
 #TabsToolbar-customization-target > .toolbarbutton-1:hover {
-  background: var(--toolbarbutton-hover-background);
-  color: inherit;
+  background: var(--toolbarbutton-hover-background) !important;
+  color: inherit !important;
 }
 
 #TabsToolbar-customization-target > .toolbarbutton-1:active {
-  background: var(--toolbarbutton-active-background);
-  color: inherit;
+  background: var(--toolbarbutton-active-background) !important;
+  color: inherit !important;
 }
 
 /* Firefox View compatibility. Use "open" instead of open="true" */
 #TabsToolbar-customization-target > .toolbarbutton-1[open] {
-  background-color: var(--toolbarbutton-active-background);
-  color: inherit;
+  background-color: var(--toolbarbutton-active-background)!important;
+  color: inherit!important;
 }
 
 #TabsToolbar-customization-target > .toolbarbutton-1 > .toolbarbutton-icon {
@@ -88,7 +88,7 @@
   background: none !important;
   background-color: unset !important;
   box-shadow: none !important;
-  padding: inherit;
+  padding: inherit!important;
 }
 
 #TabsToolbar-customization-target > .toolbarbutton-1 > .toolbarbutton-text {
@@ -99,19 +99,19 @@
 }
 
 .tab-label-container[pinned="true"]::after {
-  content: "Pinned";
-  font-size: 8.5px;
-  margin-top: -3px;
-  color: var(--panel-description-color);
-  font-weight: bold;
+  content: "Pinned"!important;
+  font-size: 8.5px!important;
+  margin-top: -3px!important;
+  color: var(--panel-description-color)!important;
+  font-weight: bold!important;
 }
 
 #TabsToolbar .toolbarbutton-1 > .toolbarbutton-text {
-  display: inherit;
+  display: inherit!important;
 }
 
 #tabbrowser-arrowscrollbox::part(scrollbutton-up), #tabbrowser-arrowscrollbox::part(scrollbutton-down) {
-  display: none;
+  display: none!important;
 }
 
 #TabsToolbar .toolbarbutton-icon {
@@ -123,14 +123,14 @@
 #tabbrowser-tabs {
   border-inline-start: none !important;
   padding-inline-start: 0 !important;
-  border-bottom: solid var(--toolbarseparator-color) 0.1px;
+  border-bottom: solid var(--toolbarseparator-color) 0.1px!important;
   padding-bottom: 0 !important;
   margin: 5px !important;
   margin-left: 2px !important;
 }
 
 #tabbrowser-arrowscrollbox-periphery {
-  display: none;
+  display: none!important;
 }
 
 #tabbrowser-arrowscrollbox {
@@ -167,7 +167,7 @@
 }
 
 #verticaltab-splitter {
-  background: var(--toolbar-bgcolor);
+  background: var(--toolbar-bgcolor)!important;
 }
 
 
@@ -185,6 +185,6 @@
 :root[inFullscreen]:not([macOSNativeFullscreen]),
 *|*:root[chromehidden~="toolbar"])
 #verticaltab-splitter {
-  display: none;
-  transition: opacity 0.3s ease-in-out;
+  display: none!important;
+  transition: opacity 0.3s ease-in-out!important;
 }
diff --git a/browser/base/content/browser-verticaltabs.mjs b/browser/base/content/browser-verticaltabs.mjs
@@ -309,6 +309,4 @@ export var gFloorpVerticalTabBar = {
   },
 };
 
-window.setTimeout(() => {
-  gFloorpVerticalTabBar.init();
-}, 1000);
+gFloorpVerticalTabBar.init();
diff --git a/browser/extensions/webextensions/floorp-system/shared/webcompat_inject.js b/browser/extensions/webextensions/floorp-system/shared/webcompat_inject.js
@@ -10,7 +10,7 @@
     {
      /*bugs: https://github.com/Floorp-Projects/Floorp/issues/894"
       description: "Twitter (X)'s direct messages doesn't work on Firefox/Floorp if user uses Meiryo font.*/
-      "matches": ["*://twitter.com/*"],
+      "matches": ["*://twitter.com/*", "*://x.com/*"],
       "css": [
         { file: "webcompat/bug-894-twitter-com.css" }
       ],