-
-
Save xinyangli/0ded98af9fe3da35f3688f81364d8c14 to your computer and use it in GitHub Desktop.
Firefox userChrome to autohide Sideberry panel and hide titlebar tabs, and autohide Page Actions.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); | |
/* This Source Code Form is subject to the terms of the Mozilla Public | |
* License, v. 2.0. If a copy of the MPL was not distributed with this | |
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */ | |
/* | |
* This style will hide the tab bar. For MacOS Big Sur | |
* | |
* Contributor(s): Isaac-Newt, Ivan0xFF, millerdev, AMomchilov | |
*/ | |
#titlebar { | |
visibility: collapse; | |
} | |
/* Position window controls */ | |
#TabsToolbar .titlebar-buttonbox-container { | |
display: block; | |
position: absolute; | |
visibility: visible; | |
} | |
/* Reposition the close/maximize/minimize buttons for the "normal" toolbar density */ | |
/* When the UI density is set to "normal", the `uidensity` attribute is undefined. */ | |
/* `window.document.documentElement.getAttribute("uidensity")` will be null. */ | |
:root:not([uidensity]) #TabsToolbar .titlebar-buttonbox-container { | |
margin-left: 12px; | |
margin-top: 12px; | |
} | |
/* Reposition the close/maximize/minimize buttons for the "compact" toolbar density */ | |
:root[uidensity="compact"] #TabsToolbar .titlebar-buttonbox-container { | |
margin-left: 10px; | |
margin-top: 9px; | |
} | |
#TabsToolbar .titlebar-buttonbox.titlebar-color { | |
margin-left: 0px !important; | |
} | |
/* | |
* Make room for window controls and a bit of extra space for window drag/move. | |
* Only apply this style when not in fullscreen mode. | |
*/ | |
#main-window:not([inFullscreen]) #nav-bar { | |
padding: 0px 0px 0px 70px !important; | |
} | |
/* Sideberry Dynamic sidebar */ | |
/* Add the following to Sideberry settings/Styles Editor/Sidebar: | |
.Tab[data-pin="false"] .ctx { | |
right: unset !important; | |
} | |
*/ | |
#sidebar-box { | |
background-color: #2B2A33; | |
overflow: hidden; | |
height: calc(100% + 6px); | |
position: fixed; | |
max-width: 26em !important; | |
width: 100% !important; | |
display: block; | |
transition: 90ms; | |
} | |
#sidebar-box:hover { | |
padding-bottom: 50px; | |
position: absolute; | |
z-index: 1; | |
} | |
#sidebar-header { | |
background-color: #2B2A33; | |
} | |
#sidebar { | |
width: calc(45px * 7) !important; | |
max-width: 50vw !important; | |
height: 100%; | |
} | |
#sidebar:hover { | |
max-width: 100% !important; | |
} | |
#appcontent { | |
margin-left: 45px; | |
} | |
/* Page Actions Hide and Show on Hover */ | |
/* Hide Buttons and Reveal on Hover */ | |
#page-action-buttons:not(:hover) .urlbar-page-action, | |
#page-action-buttons:not(:hover) #star-button | |
{ | |
width: 0px !important; | |
min-width: 0px !important; | |
padding-left: 0px !important; | |
padding-right: 10px !important; | |
margin-right: -5px !important; | |
transition: all 250ms ease-in-out; | |
} | |
#page-action-buttons:not(:hover) #userContext-indicator { | |
margin-right : 45px !important; | |
transition: all 250ms ease-in-out; | |
} | |
#page-action-buttons:hover .urlbar-page-action, | |
#page-action-buttons:hover #star-button { | |
visibility: visible; | |
min-width: unset !important; | |
} | |
#page-action-buttons:hover #userContext-indicator { | |
margin-right : 0px !important; | |
} | |
/* Create page actions hover "button" */ | |
#page-action-buttons::after { | |
content: "•••"; | |
position: absolute; | |
top: 0.7em; | |
font-size: 0.7em; | |
opacity: 0.5; | |
right: 8px; | |
transition: all 50ms ease-in-out; | |
} | |
/* Hide the button on hover */ | |
#page-action-buttons:hover::after { | |
display: none !important; | |
width: 0px !important; | |
margin-left: 0px !important; | |
transition: all 50ms ease-in-out; | |
} | |
/* Hide URLBar Buttons and Reveal on Hover Finished*/ | |
#urlbar,#searchbar { | |
font-size: 13px !important; | |
margin-top: 1px !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment