diff --git a/chrome/autohide_bookmarks_and_main_toolbars.css b/chrome/autohide_bookmarks_and_main_toolbars.css index 5cd4802..dc79048 100644 --- a/chrome/autohide_bookmarks_and_main_toolbars.css +++ b/chrome/autohide_bookmarks_and_main_toolbars.css @@ -1,6 +1,9 @@ /* Source file https://github.com/MrOtherGuy/firefox-csshacks/tree/master/chrome/autohide_bookmarks_and_main_toolbars.css made available under Mozilla Public License v. 2.0 See the above repository for updates as well as full license text. */ +/* Dummy variable to support both versions 89-90 */ +:root{ --tab-block-margin: var(--proton-tab-block-margin) } + #navigator-toolbox{ --uc-bm-height: 22px; /* Might need to adjust if the toolbar has other buttons */ --uc-bm-padding: 2px; /* Vertical padding to be applied to bookmarks */ @@ -25,7 +28,7 @@ See the above repository for updates as well as full license text. */ :root[sessionrestored] #PersonalToolbar{ background-image: linear-gradient(var(--toolbar-bgcolor),var(--toolbar-bgcolor)), var(--lwt-additional-images,var(--toolbar-bgimage)) !important; background-position: top,var(--lwt-background-alignment); - background-position-y: calc(0px - var(--tab-min-height) - 2*var(--proton-tab-block-margin,0px)); + background-position-y: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin,0px)); background-repeat: repeat,var(--lwt-background-tiling); transform: rotateX(90deg); transform-origin: top; @@ -35,7 +38,7 @@ See the above repository for updates as well as full license text. */ :root[sessionrestored] #PersonalToolbar{ z-index: 1; - background-position-y: calc(0px - var(--tab-min-height) - 2*var(--proton-tab-block-margin,0px) + var( --uc-navbar-height)); + background-position-y: calc(0px - var(--tab-min-height) - 2*var(--tab-block-margin,0px) + var( --uc-navbar-height)); } :root[lwtheme-image] #nav-bar, diff --git a/chrome/compact_proton.css b/chrome/compact_proton.css index e9cc163..53dbdb8 100644 --- a/chrome/compact_proton.css +++ b/chrome/compact_proton.css @@ -6,6 +6,7 @@ See the above repository for updates as well as full license text. */ :root{ --toolbarbutton-inner-padding: 6px !important; --proton-tab-block-margin: 2px !important; + --tab-block-margin: 2px !important; --tabs-shadow-size: 0px !important; --arrowpanel-menuitem-padding: 5px !important; --panel-font-size: inherit !important; diff --git a/chrome/curved_tabs.css b/chrome/curved_tabs.css index ad04a36..eb986f2 100644 --- a/chrome/curved_tabs.css +++ b/chrome/curved_tabs.css @@ -7,6 +7,7 @@ See the above repository for updates as well as full license text. */ --uc-tab-curve-size:17px; /* 10px looks about like chromium - 17px looks close to Australis tabs */ --uc-tabs-scrollbutton-border: 0px; --proton-tab-block-margin:0px; + --tab-block-margin:0px; --tab-min-height: 34px; --uc-tab-line-color: rgb(10, 132, 255); } diff --git a/chrome/hide_tabs_with_one_tab.css b/chrome/hide_tabs_with_one_tab.css index fd07a8e..68f2ea1 100644 --- a/chrome/hide_tabs_with_one_tab.css +++ b/chrome/hide_tabs_with_one_tab.css @@ -4,6 +4,8 @@ See the above repository for updates as well as full license text. */ /* Makes tabs toolbar items zero-height initially and sets enlarge them to fill up space equal to tab-min-height set on tabs. Optionally use privatemode_indicator_as_menu_button.css to replace main menu icon with private browsing indicator while tabs are hidden. */ /* Firefox 65+ only */ +/* Dummy variable to support both versions 89-90 */ +:root{ --tab-block-margin: var(--proton-tab-block-margin) } :root[sizemode="normal"] #nav-bar{ --uc-window-drag-space-width: 20px } @@ -30,7 +32,7 @@ See the above repository for updates as well as full license text. */ } .accessibility-indicator > hbox{ padding-block: 0 !important } -#tabbrowser-tabs .tabbrowser-tab{ height: calc(var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)) } +#tabbrowser-tabs .tabbrowser-tab{ height: calc(var(--tab-min-height) + 2 * var(--tab-block-margin,0px)) } #tabbrowser-tabs .tabbrowser-tab[first-visible-tab="true"][last-visible-tab="true"]{ visibility: collapse !important; diff --git a/chrome/hide_tabs_with_one_tab_w_window_controls.css b/chrome/hide_tabs_with_one_tab_w_window_controls.css index 38639cb..f34d6fc 100644 --- a/chrome/hide_tabs_with_one_tab_w_window_controls.css +++ b/chrome/hide_tabs_with_one_tab_w_window_controls.css @@ -11,6 +11,9 @@ Get window_control_placeholder_support.css Window controls will be all wrong without it */ +/* Dummy variable to support both versions 89-90 */ +:root{ --tab-block-margin: var(--proton-tab-block-margin) } + #titlebar{ -moz-appearance: none !important; } /* We'll use window controls from menubar instead */ #TabsToolbar > .titlebar-buttonbox-container { display: none } @@ -66,5 +69,5 @@ Window controls will be all wrong without it :root[sizemode="fullscreen"] .titlebar-buttonbox-container{ display: none !important; } :root[sizemode="fullscreen"] #TabsToolbar > #window-controls{ z-index: 2; - top: calc(var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)); + top: calc(var(--tab-min-height) + 2 * var(--tab-block-margin,0px)); } \ No newline at end of file diff --git a/chrome/multi-row_tabs.css b/chrome/multi-row_tabs.css index 3d74fbb..e826064 100644 --- a/chrome/multi-row_tabs.css +++ b/chrome/multi-row_tabs.css @@ -28,6 +28,10 @@ See the above repository for updates as well as full license text. */ } @-moz-document url(chrome://browser/content/browser.xhtml){ + + /* Dummy variable to support both versions 89-90 */ + :root{ --tab-block-margin: var(--proton-tab-block-margin) } + #scrollbutton-up~spacer, #scrollbutton-up, #scrollbutton-down{ display: var(--scrollbutton-display-model,initial) } @@ -36,7 +40,7 @@ See the above repository for updates as well as full license text. */ display: flex; flex-wrap: wrap; overflow-y: auto; - max-height: calc((var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)) * var(--multirow-n-rows)); + max-height: calc((var(--tab-min-height) + 2 * var(--tab-block-margin,0px)) * var(--multirow-n-rows)); scrollbar-color: currentColor transparent; scrollbar-width: thin; scroll-snap-type: y mandatory; diff --git a/chrome/multi-row_tabs_below_content.css b/chrome/multi-row_tabs_below_content.css index 16e7311..55de4bc 100644 --- a/chrome/multi-row_tabs_below_content.css +++ b/chrome/multi-row_tabs_below_content.css @@ -17,7 +17,10 @@ See the above repository for updates as well as full license text. */ /* So this setting does nothing on Fx65 and all tab rows will be shown */ @-moz-document url(chrome://browser/content/browser.xhtml){ - + + /* Dummy variable to support both versions 89-90 */ + :root{ --tab-block-margin: var(--proton-tab-block-margin) } + :root{ --multirow-toolbar-height: 40px; --multirow-top-padding: 0px; @@ -150,14 +153,14 @@ See the above repository for updates as well as full license text. */ overflow: -moz-hidden-unscrollable; display: block; --scrollbutton-display-model: none; - --uc-scrollbox-max-height: calc((var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)) * var(--multirow-n-rows)); + --uc-scrollbox-max-height: calc((var(--tab-min-height) + 2 * var(--tab-block-margin,0px)) * var(--multirow-n-rows)); } :root[inFullscreen] .scrollbox-clip[orient="horizontal"]:not(:hover), :root[inFullscreen] #tabbrowser-arrowscrollbox:not(:hover){ --uc-scrollbox-max-height: 1px; min-height: 1px !important; } .tabbrowser-tab{ - height: calc((var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px))) !important; + height: calc((var(--tab-min-height) + 2 * var(--tab-block-margin,0px))) !important; scroll-snap-align: start; } diff --git a/chrome/navbar_tabs_oneliner.css b/chrome/navbar_tabs_oneliner.css index eb3457a..bacd780 100644 --- a/chrome/navbar_tabs_oneliner.css +++ b/chrome/navbar_tabs_oneliner.css @@ -9,7 +9,10 @@ See the above repository for updates as well as full license text. */ urlbar_popup_full_width.css is VERY MUCH recommended for Firefox 71+ because of new urlbar popup */ -:root[proton][uidensity="compact"]{ --proton-tab-block-margin: 2px !important; } +:root[uidensity="compact"]{ + --tab-block-margin: 2px !important; + --proton-tab-block-margin: 2px !important; +} /* Modify these to change relative widths or default height */ #navigator-toolbox{ @@ -35,7 +38,7 @@ urlbar_popup_full_width.css is VERY MUCH recommended for Firefox 71+ because of --tabs-navbar-shadow-size: 0px; } #tabbrowser-tabs{ - --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--proton-tab-block-margin,0px)) !important; + --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--tab-block-margin,0px)) !important; } /* This isn't useful when tabs start in the middle of the window */ diff --git a/chrome/navbar_tabs_oneliner_menu_buttons_on_right.css b/chrome/navbar_tabs_oneliner_menu_buttons_on_right.css index 9443930..c463251 100644 --- a/chrome/navbar_tabs_oneliner_menu_buttons_on_right.css +++ b/chrome/navbar_tabs_oneliner_menu_buttons_on_right.css @@ -9,7 +9,10 @@ Get window_control_placeholder_support.css Window controls will be all wrong without it */ -:root[proton][uidensity="compact"]{ --proton-tab-block-margin: 2px !important; } +:root[uidensity="compact"]{ + --tab-block-margin: 2px !important; + --proton-tab-block-margin: 2px !important; +} /* Modify these to change relative widths or default height */ #navigator-toolbox{ @@ -49,7 +52,7 @@ Window controls will be all wrong without it } #tabbrowser-tabs{ - --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--proton-tab-block-margin,0px)) !important; + --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--tab-block-margin,0px)) !important; } /* Need to set background color for selected tab so it can be distinguished from background */ #TabsToolbar .tab-background[selected]{ diff --git a/chrome/navbar_tabs_oneliner_tabs_on_left.css b/chrome/navbar_tabs_oneliner_tabs_on_left.css index a0dbeb1..f9acade 100644 --- a/chrome/navbar_tabs_oneliner_tabs_on_left.css +++ b/chrome/navbar_tabs_oneliner_tabs_on_left.css @@ -9,7 +9,10 @@ Get window_control_placeholder_support.css Window controls will be all wrong without it */ -:root[proton][uidensity="compact"]{ --proton-tab-block-margin: 2px !important; } +:root[uidensity="compact"]{ + --tab-block-margin: 2px !important; + --proton-tab-block-margin: 2px !important; + } /* Modify these to change relative widths or default height */ #navigator-toolbox{ @@ -52,7 +55,7 @@ Window controls will be all wrong without it } #tabbrowser-tabs{ - --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--proton-tab-block-margin,0px)) !important; + --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--tab-block-margin,0px)) !important; } #toolbar-menubar[autohide="true"] > .titlebar-buttonbox-container{ diff --git a/chrome/navbar_tabs_responsive_oneliner.css b/chrome/navbar_tabs_responsive_oneliner.css index a9becf4..3045466 100644 --- a/chrome/navbar_tabs_responsive_oneliner.css +++ b/chrome/navbar_tabs_responsive_oneliner.css @@ -12,7 +12,10 @@ See the above repository for updates as well as full license text. */ /* Modify it to suit your needs */ @media screen and (min-width: 1100px){ - :root[proton][uidensity="compact"]{ --proton-tab-block-margin: 2px !important; } + :root[uidensity="compact"]{ + --tab-block-margin: 2px !important; + --proton-tab-block-margin: 2px !important; + } /* Modify these to change relative widths or default height */ #navigator-toolbox{ @@ -38,7 +41,7 @@ See the above repository for updates as well as full license text. */ --tabs-navbar-shadow-size: 0px; } #tabbrowser-tabs{ - --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--proton-tab-block-margin,0px)) !important; + --tab-min-height: calc(var(--uc-toolbar-height) - 2 * var(--tab-block-margin,0px)) !important; } /* This isn't useful when tabs start in the middle of the window */ diff --git a/chrome/non_floating_sharp_tabs.css b/chrome/non_floating_sharp_tabs.css index 8660d30..efe8668 100644 --- a/chrome/non_floating_sharp_tabs.css +++ b/chrome/non_floating_sharp_tabs.css @@ -7,6 +7,7 @@ See the above repository for updates as well as full license text. */ :root{ --proton-tab-block-margin: 0px !important; + --tab-block-margin: 0px !important; --tabs-shadow-size: 1px !important; /* Remove next line if you want selected tab to have color other than toolbar background - then it follows your theme color */ diff --git a/chrome/overlay_menubar.css b/chrome/overlay_menubar.css index 4a34607..e6dbdb9 100644 --- a/chrome/overlay_menubar.css +++ b/chrome/overlay_menubar.css @@ -3,6 +3,9 @@ See the above repository for updates as well as full license text. */ /* Makes menubar appear as overlay in the top left corner */ +/* Dummy variable to support both versions 89-90 */ +:root{ --tab-block-margin: var(--proton-tab-block-margin) } + #toolbar-menubar{ position: fixed; display: flex; @@ -20,7 +23,7 @@ See the above repository for updates as well as full license text. */ #toolbar-menubar[inactive] > .titlebar-buttonbox-container{ display: none } #main-menubar{ - height: calc(var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)); + height: calc(var(--tab-min-height) + 2 * var(--tab-block-margin,0px)); background-color: var(--arrowpanel-background); color: var(--arrowpanel-color); } @@ -30,7 +33,7 @@ See the above repository for updates as well as full license text. */ content: ""; display: -moz-box; width: 30px; - height: calc(var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)); + height: calc(var(--tab-min-height) + 2 * var(--tab-block-margin,0px)); background-image: linear-gradient(to right, var(--arrowpanel-background) 30%, transparent); } diff --git a/chrome/tabs_below_content.css b/chrome/tabs_below_content.css index 9ee2b28..efd66a9 100644 --- a/chrome/tabs_below_content.css +++ b/chrome/tabs_below_content.css @@ -10,6 +10,9 @@ Additionally on Linux, you may need to get: linux_gtk_window_control_patch.css */ +/* Dummy variable to support both versions 89-90 */ +:root{ --tab-block-margin: var(--proton-tab-block-margin) } + .titlebar-buttonbox-container{ position: fixed; display: block; @@ -37,7 +40,7 @@ linux_gtk_window_control_patch.css :root[sizemode="maximized"] #toolbar-menubar:not([autohide="false"]) .titlebar-buttonbox-container{ top: 8px } } /* Move tabs below content */ -:root:not([inDOMFullscreen]) #browser-bottombox{ margin-bottom: calc(var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)) } +:root:not([inDOMFullscreen]) #browser-bottombox{ margin-bottom: calc(var(--tab-min-height) + 2 * var(--tab-block-margin,0px)) } :root[inFullscreen]:not([inDOMFullscreen]) #browser-bottombox{ margin-bottom: 1px; } #TabsToolbar{ @@ -45,7 +48,7 @@ linux_gtk_window_control_patch.css display: block; bottom: 0; width: 100vw; - height: calc(var(--tab-min-height) + 2 * var(--proton-tab-block-margin,0px)); + height: calc(var(--tab-min-height) + 2 * var(--tab-block-margin,0px)); --tabs-navbar-shadow-size: 0px; } #TabsToolbar:hover{ z-index: 1 }