Skip to content

Instantly share code, notes, and snippets.

@okitavera
Created January 27, 2018 16:51
Show Gist options
  • Save okitavera/ca92da3df993cf93a331d9ca917b508f to your computer and use it in GitHub Desktop.
Save okitavera/ca92da3df993cf93a331d9ca917b508f to your computer and use it in GitHub Desktop.
My Current userChrome.css
/* Auto-hide toolbar */
:root[uidensity=compact] #navigator-toolbox {
--nav-bar-height: 33px;
}
:root:not([uidensity]) #navigator-toolbox {
--nav-bar-height: 39px;
}
:root[uidensity=touch] #navigator-toolbox {
--nav-bar-height: 41px;
}
#navigator-toolbox {
--tabbar-height: calc(var(--tab-min-height) + var(--space-above-tabbar));
--trigger-area-height: 5px;
}
:root[chromehidden~="toolbar"] #navigator-toolbox {
--tabbar-height: 0.1px;
}
#toolbar-menubar {
margin-top: 0px !important;
}
:root[sizemode="normal"][chromehidden~="menubar"] #TabsToolbar,
:root[sizemode="normal"] #toolbar-menubar[autohide="true"][inactive] + #TabsToolbar {
padding-top: var(--space-above-tabbar) !important;
}
#nav-bar, #PersonalToolbar {
-moz-window-dragging: default;
}
:root:not([customizing]) #nav-bar
{
overflow-y: hidden;
max-height:0;
min-height:0 !important;
padding-top:0 !important;
padding-bottom:0 !important;
opacity: 0;
}
:root:not([customizing]) :hover > #nav-bar,
:root:not([customizing]) #nav-bar:focus-within {
max-height: var(--nav-bar-height);
opacity: 1;
transition: opacity 0.15s ease-in, max-height 0.15s linear;
}
:root:not([customizing]) #navigator-toolbox {
max-height: calc(var(--tabbar-height) + var(--trigger-area-height));
min-height: var(--tabbar-height);
margin-bottom: calc(-1 * var(--trigger-area-height));
}
:root:not([customizing]) #navigator-toolbox:hover,
:root:not([customizing]) #navigator-toolbox:focus-within {
max-height: calc(var(--tabbar-height) + var(--nav-bar-height));
margin-bottom: calc(0px - var(--nav-bar-height));
}
:root:not([customizing]) #PersonalToolbar {
max-height: 0 !important;
min-height: 0.1px !important;
opacity: 0;
transition: opacity 0.15s ease-in !important;
}
:root:not([customizing]) :hover > #PersonalToolbar,
:root:not([customizing]) #navigator-toolbox:focus-within #PersonalToolbar {
max-height: 4em !important;
opacity: 1;
}
/* End of Auto-hide toolbar */
/* Hide selected-tab line */
#TabsToolbar .tabbrowser-tab[selected] .tab-line {
display: none !important;
}
/* Make Toolbar Buttons Grayscale */
.toolbarbutton-1 {
filter: grayscale(100%) !important;
}
/* Hide Tabs favicon */
.tabbrowser-tab .tab-icon-image {
display: none !important;
}
/* Hide tab close button */
#TabsToolbar .close-icon {
display: none !important;
}
/* Unhide the tab close button on hover when it is the selected tab and not pinned */
#TabsToolbar .tabbrowser-tab[selected]:not([pinned]):hover .close-icon {
display: inline-block !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment