MrOtherGuy / firefox-csshacks

Collection of userstyles affecting the browser
Mozilla Public License 2.0
3.19k stars 312 forks source link

Multi-row tabs below content / bookmarks toolbar problem. #269

Closed ZorisBube closed 1 year ago

ZorisBube commented 1 year ago

Hi, I've been using your "tabs below content.css" codes for years. They are great, thanks for that.

Today i tried to use "multi-row tabs below content.css" for the first time, also with the boolean pref to enable static menu bar. But my bookmarks toolbar also placed below the tabs, i mean at the very bottom. Is there a way to fix it and place it just below the url bar as it's before? (URL or the navigation bar.. I don't know how to name it)

Also i would like to ask another question.. When using "tabs below content.css" with "autohide_bookmarks_toolbar.css" , bookmarks appear in two ways. When hovering to the top navigation bar and when hovering the tabs which are placed below content. Is it possible to prevent bookmarks popping up when hovering over tabs?

Ver. 111.0.1

Thanks and best regards...

MrOtherGuy commented 1 year ago

This is somewhat complicated. It should be possible, and you can try it out with something like this:

@-moz-document url(chrome://browser/content/browser.xhtml){
  :root{
    --multirow-top-bookmarks-height: 28px;
  }
  #customization-container,
  :root:not([inFullscreen]) #content-deck,
  :root:not([inFullscreen]) #browser{
    margin-top: calc(var(--multirow-toolbar-height) + var(--multirow-top-padding) + var(--multirow-top-bookmarks-height) + var(--multirow-menubar-height,0px));
  }
  #PersonalToolbar{
    position: fixed;
    top: calc(var(--multirow-toolbar-height) + var(--multirow-top-padding) + var(--multirow-menubar-height,0px));
    width: 100vw;
  }
}

But there are problems: such that you need to explicitly set height for it - the 28px would depend on used font, font size on your platform, whether or not there are other buttons in the bookmarks toolbar etc. And it doesn't support autohiding - nor the setting to only show bookmarks toolbar on new tabs. I mean, the toolbar should hide just fine - but it will still continue to reserve space above the web-content area. On the other hand, if you want a bookmarks toolbar that never reserves space above web-content (like with autohide_bookmarks_toolbar.css) then that should be simpler.

ZorisBube commented 1 year ago

Thank you MrOtherGuy.. I just added the code to the bottom of the css and now bookmarks toolbar is below URL bar.. As you said autohide is not working but i believe i can live with that. Another css from another git user works but has the same problem as i mentioned in my first message . It pops up both when hovering the nav bar and also down the tabs bar which i don't want...

Any solutions for my second question? If i reverted back to use just "tabs below content.css" with "autohide_bookmarks_toolbar.css" combo.. Is that possible to do what i asked.

Thank you again..

MrOtherGuy commented 1 year ago

For that you can replace line 43 with this:

#PersonalToolbar:hover,
#nav-bar:hover + #PersonalToolbar{
ZorisBube commented 1 year ago

Thanks to you, right now it's working as I want it to be! Thank you again for your help and best regards..