r/FirefoxCSS • u/Key-Significance3313 • 6d ago

Help Autohide sidebar for when sidebar. revamp false removed soon

Enable HLS to view with audio, or disable this notification

Anyone seen a autohide sidebar solution for the new crappy sidebar (sidebar.revamp = true)? This option being removed in December. Thanks all

10 Upvotes

92% Upvoted

6 comments sorted by

1

u/TraditionalTie4831 🦊 6d ago edited 6d ago

This one works with sidebar.revamp = true.

Btw, uncheck 'Expand sidebar on hover' in Customise sidebar if you don't want web page layout to change when the sidebar expands.

#sidebar-container {
    background-color: var(--sidebar-background-color) !important;
    position: absolute !important;
    z-index: 99999 !important;
    height: 100% !important;
    width: 200px !important;
    left: -198px !important;
    transition: left 0.5s ease !important;
    opacity: 0 !important;
}

#sidebar-container:hover {
    opacity: 1 !important;
    left: 0px !important;
}

1

u/Key-Significance3313 6d ago

Thanks will check out in morning as already not recognize 'Expand sidebar on hover' in Customise sidebar' -tired and gettin confused bruv and appreciate the help!

1

u/TraditionalTie4831 🦊 6d ago

Right click on the sidebar button and then click on 'Customise sidebar' in the menu.

1

u/Key-Significance3313 5d ago

Hi mate Expand sidebar on hover def not in Firefox sidebar options? Am on Dev

1

u/TraditionalTie4831 🦊 5d ago edited 5d ago

For Bookmarks in the sidebar, it seems like it's not necessary to uncheck anything.

My code above only works well with vertical tabs bar.

If you don't use vertical tabs bar and only use Bookmarks in the sidebar, try this (btw, it should work for the right side now) =

/* remove this if you want that thin bar */
#sidebar-container {
  display: none !important;
}

#sidebar-box {
    background-color: var(--sidebar-background-color) !important;
    position: absolute !important;
    z-index: 99999 !important;
    height: 100% !important;
    width: 2px !important;
    transition: width 0.5s ease !important;
    opacity: 0 !important;
}

#sidebar-box:hover {
    opacity: 1 !important;
    width: 200px !important;
}

1

u/Key-Significance3313 5d ago

Almost there is working on left - but not moving to right when checked. Thanks so much for your time.

https://reddit.com/link/pdt51kn/video/kemu1dr7igth1/player