Last active
April 2, 2020 15:05
-
-
Save lazerl0rd/cdbf4a8f89ee56237ebc397a583e63ba to your computer and use it in GitHub Desktop.
A userChrome.css for Firefox.
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
/* | |
CleanFox (A userChrome.css for Firefox) | |
By: Diab Neiroukh | |
Based-on: https://github.com/coekuss/quietfox by coekuss | |
Licensed-under: The MIT License | |
Last-updated: 23/Feb/2020 | |
*/ | |
* { | |
--tab-corner-rounding: 5px; | |
--button-corner-rounding: 4px; | |
--menu-item-height: 23px; | |
--animation-speed: 0.15s | |
} | |
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); | |
tab[visuallyselected] .tab-background::after,tab[visuallyselected] .tab-background::before { | |
content: "" !important; | |
display: inline !important; | |
position: absolute !important; | |
width: var(--tab-corner-rounding) !important; | |
height: var(--tab-corner-rounding) !important; | |
bottom: -1px !important; | |
pointer-events: none !important; | |
background-color: transparent !important; | |
transition: var(--animation-speed) !important | |
} | |
tab[visuallyselected] .tab-background::before { | |
border-bottom-right-radius: var(--tab-corner-rounding) !important; | |
transform: translateX(calc(-1 * var(--tab-corner-rounding))) !important; | |
box-shadow: 4px 4px 0 4px var(--toolbar-bgcolor) !important; | |
transition: var(--animation-speed) !important | |
} | |
tab[visuallyselected] .tab-background::after { | |
border-bottom-left-radius: var(--tab-corner-rounding) !important; | |
right: 0 !important; | |
transform: translateX(calc(var(--tab-corner-rounding) + 1px)) !important; | |
box-shadow: -4px 4px 0 4px var(--toolbar-bgcolor) !important; | |
transition: var(--animation-speed) !important | |
} | |
.panel-arrowcontent,panelview:not([extension]) { | |
background-color: var(--toolbar-bgcolor) !important; | |
color: var(--toolbar-color) !important | |
} | |
.subviewbutton,.toolbarbutton-icon,stack,toolbarbutton,vbox { | |
transition: background-color var(--animation-speed) !important | |
} | |
.titlebar-spacer[type="pre-tabs"] { | |
border-inline-end: 0 !important; | |
width: 0 !important | |
} | |
scrollbox[part="scrollbox"][flex="1"][orient="horizontal"] { | |
padding-left: 12px !important | |
} | |
.tab-background,.tab-loading-burst { | |
border-radius: var(--tab-corner-rounding) var(--tab-corner-rounding) 0 0 !important; | |
margin: -1px !important | |
} | |
tab:not(:active) .tab-background { | |
transition: background-color var(--animation-speed) !important | |
} | |
:root[uidensity="compact"] { | |
--tab-min-height: 31px !important | |
} | |
tab:not([selected]):hover .tab-background { | |
background-color: var(--toolbarbutton-hover-background) !important | |
} | |
tab { | |
min-width: 1px !important; | |
clip-width: 1px !important; | |
padding-bottom: 1px !important | |
} | |
.tab-line { | |
display: none !important | |
} | |
tab:not([beforeselected-visible])::after { | |
margin-top: 4px !important; | |
margin-bottom: 4px !important; | |
transition: border-color var(--animation-speed), margin-top var(--animation-speed) !important | |
} | |
tab:hover::after,tab[beforehovered]::after { | |
border-color: transparent !important; | |
margin-top: 20px !important | |
} | |
#navigator-toolbox { | |
--tabs-border-color: transparent !important | |
} | |
tab[visuallyselected] { | |
box-shadow: 0 3px 12px -5px black !important | |
} | |
[last-visible-tab] { | |
margin-right: calc(var(--tab-corner-rounding) + 2px) !important | |
} | |
.toolbarbutton-badge-stack,.toolbarbutton-icon { | |
background-color: transparent !important | |
} | |
.toolbarbutton-1:not(#back-button)[open],toolbarbutton:not(#back-button)[open] { | |
background-color: var(--toolbarbutton-active-background) | |
} | |
#nav-bar .toolbarbutton-1 { | |
margin-right: 2px !important | |
} | |
.close-icon:not(.tab-close-button):hover { | |
fill-opacity: 0.0 !important | |
} | |
.toolbarbutton-1:not(#back-button):not([disabled]):not([open]):hover,toolbarbutton:not(#back-button):not([disabled]):not([open]):hover { | |
background-color: var(--toolbarbutton-hover-background) !important | |
} | |
.tab-close-button { | |
transition: fill-opacity var(--animation-speed) !important | |
} | |
.findbar-textbox:focus { | |
border: 1px solid grey !important | |
} | |
#BMB_bookmarksShowAll { | |
display: none !important | |
} | |
:root:not([uidensity="compact"]) #back-button > .toolbarbutton-icon { | |
background-color: transparent !important; | |
border: none !important; | |
transition: background-color var(--animation-speed) !important | |
} | |
:root:not([uidensity="compact"]) #back-button:not([disabled]):not([open]):hover > .toolbarbutton-icon { | |
background-color: var(--toolbarbutton-hover-background) !important; | |
box-shadow: none !important | |
} | |
:root:not([uidensity="compact"]) #back-button:not([disabled]):not([open]):active > .toolbarbutton-icon { | |
background-color: var(--toolbarbutton-active-background) !important; | |
box-shadow: none !important | |
} | |
.toolbarbutton-1:not(#back-button):not([disabled]):not([open]):active,:root:not([uidensity="compact"]) toolbarbutton:not(#back-button):not([disabled]):not([open]):active { | |
background-color: var(--toolbarbutton-active-background) !important | |
} | |
:root:not([uidensity="compact"]) #back-button[open] > .toolbarbutton-icon { | |
background-color: var(--toolbarbutton-active-background) !important | |
} | |
:root:not([uidensity="compact"]) #PersonalToolbar { | |
height: 30px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #nav-bar .toolbarbutton-1:not(#back-button) { | |
margin: 4px 0 !important; | |
padding-left: 3px !important; | |
padding-right: 3px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #nav-bar .toolbarbutton-1:not(#back-button) image { | |
margin-bottom: 1px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #back-button { | |
margin-top: -1px !important; | |
margin-bottom: -1px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #identity-box,:root:not([uidensity="touch"]):not([uidensity="compact"]) #tracking-protection-icon-container { | |
padding-left: 8px !important; | |
padding-right: 8px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #identity-icon,:root:not([uidensity="touch"]):not([uidensity="compact"]) #tracking-protection-icon-box { | |
margin-left: 1px !important; | |
margin-right: 1px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #urlbar { | |
height: 36px !important; | |
margin-top: 0 !important; | |
margin-bottom: 0 !important; | |
padding-top: 0 !important; | |
padding-bottom: 0 !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) .urlbar-icon:not(#pocket-button) { | |
width: 34px !important; | |
height: 36px !important; | |
padding: 8px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #pocket-button { | |
width: 32px !important; | |
height: 36px !important; | |
padding: 8px 8px 6px 8px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #contextual-feature-recommendation { | |
width: 32px !important; | |
height: 32px !important; | |
padding: 2px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #PanelUI-button { | |
padding-right: 5px !important; | |
padding-left: 5px !important; | |
margin-left: 5px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #library-animatable-box { | |
margin-top: 4px !important | |
} | |
:root:not([uidensity="touch"]):not([uidensity="compact"]) #tabs-newtab-button { | |
margin-left: -5px !important; | |
padding-left: 2px !important; | |
margin-bottom: 1px !important; | |
padding-bottom: 1px !important | |
} | |
:root[uidensity="compact"] #nav-bar .toolbarbutton-1 { | |
margin-top: 4px !important; | |
margin-bottom: 4px !important; | |
padding: 0 0 0 0 !important | |
} | |
:root[uidensity="compact"] #nav-bar toolbaritem[animate] box { | |
margin-top: 1px !important | |
} | |
:root[uidensity="compact"] #back-button[open] { | |
background-color: var(--toolbarbutton-active-background) !important | |
} | |
:root[uidensity="compact"] #back-button:not([disabled]):not([open]):hover { | |
background-color: var(--toolbarbutton-hover-background) !important | |
} | |
:root[uidensity="compact"] #back-button:not([disabled]):not([open]):active { | |
background-color: var(--toolbarbutton-active-background) !important | |
} | |
:root[uidensity="compact"] #identity-box,:root[uidensity="compact"] #tracking-protection-icon-container { | |
min-width: 2px !important; | |
padding-left: 6px !important; | |
padding-right: 6px !important | |
} | |
:root[uidensity="compact"] #nav-bar { | |
padding-top: 1px !important | |
} | |
:root[uidensity="compact"] #urlbar { | |
height: 30px !important; | |
margin-top: 0 !important; | |
margin-bottom: 0 !important; | |
padding-bottom: 0 !important | |
} | |
:root[uidensity="compact"] .urlbar-icon:not(#pocket-button) { | |
width: 28px !important; | |
height: 30px !important; | |
padding: 6px !important | |
} | |
:root[uidensity="compact"] #pocket-button { | |
width: 28px !important; | |
height: 40px !important; | |
padding: 7px 6px 5px 6px !important | |
} | |
:root[uidensity="compact"] #contextual-feature-recommendation { | |
width: 32px !important; | |
height: 32px !important; | |
padding: 2px !important | |
} | |
:root[uidensity="compact"] #PersonalToolbar { | |
height: 25px !important | |
} | |
:root[uidensity="compact"] #library-animatable-box { | |
margin-top: 5px !important | |
} | |
:root[uidensity="compact"] #tabs-newtab-button { | |
margin-left: -5px !important; | |
margin-bottom: 1px !important; | |
padding-bottom: 1px !important | |
} | |
:root[uidensity="touch"] #nav-bar .toolbarbutton-1:not(#back-button) { | |
margin-top: 5px !important; | |
margin-bottom: 3px !important; | |
padding-left: 0 !important; | |
padding-right: 0 !important | |
} | |
:root[uidensity="touch"] #stop-reload-button[animate] .toolbarbutton-animatable-image { | |
margin-top: 2px !important | |
} | |
:root[uidensity="touch"] #identity-box,:root[uidensity="touch"] #tracking-protection-icon-container { | |
padding-left: 9px !important; | |
padding-right: 9px !important | |
} | |
:root[uidensity="touch"] #urlbar { | |
height: 36px !important; | |
margin-top: 0 !important; | |
margin-bottom: 0 !important | |
} | |
:root[uidensity="touch"] #nav-bar { | |
padding-top: 2px !important | |
} | |
:root[uidensity="touch"] .urlbar-icon:not(#pocket-button) { | |
width: 34px !important; | |
height: 36px !important; | |
padding: 9px !important | |
} | |
:root[uidensity="touch"] #pocket-button { | |
width: 34px !important; | |
height: 36px !important; | |
padding: 10px 7px 8px 7px !important | |
} | |
:root[uidensity="touch"] #contextual-feature-recommendation { | |
width: 32px !important; | |
height: 33px !important; | |
padding: 2px !important | |
} | |
:root[uidensity="touch"] #PanelUI-button { | |
padding-left: 5px !important; | |
padding-right: 5px !important | |
} | |
:root[uidensity="touch"] tab { | |
height: 40px !important | |
} | |
:root[uidensity="touch"] #library-animatable-box { | |
margin-top: 7px !important | |
} | |
:root[uidensity="touch"] #tabs-newtab-button { | |
margin-left: -5px !important; | |
margin-bottom: 2px !important; | |
padding-right: 3px !important; | |
padding-left: 3px !important; | |
padding-bottom: 1px !important | |
} | |
#identity-box,#reader-mode-button,#tracking-protection-icon-container,.toolbarbutton-1 > stack,.urlbar-history-dropmarker,.urlbar-input-box,.urlbar-page-action,[anonid=urlbar-go-button],toolbarbutton:not(.titlebar-button):not([class^="findbar-find"]):not([class^="scrollbutton"]),.close-icon { | |
border-radius: var(--button-corner-rounding)!important | |
} | |
.findbar-find-next { | |
border-radius: 0 var(--button-corner-rounding) var(--button-corner-rounding) 0 !important | |
} | |
.findbar-textbox { | |
border-radius: var(--button-corner-rounding) 0 0 var(--button-corner-rounding) !important | |
} | |
.bookmark-item { | |
padding-left: 7px !important; | |
padding-right: 7px !important; | |
margin-right: 0 !important | |
} | |
#urlbar { | |
border-radius: calc(1px + var(--button-corner-rounding)) !important | |
} | |
#identity-box { | |
margin-right: 0 !important | |
} | |
#urlbar { | |
border-color: transparent !important; | |
box-shadow: none !important | |
} | |
#tracking-protection-icon-container { | |
border-inline-end: none !important | |
} | |
#pageActionSeparator { | |
display: none !important | |
} | |
#userContext-indicator,#userContext-label,.urlbar-icon { | |
fill: transparent !important; | |
background-color: transparent !important; | |
color: transparent !important; | |
transition: var(--animation-speed) !important | |
} | |
#urlbar:active .urlbar-icon,#urlbar:hover .urlbar-icon,#urlbar[focused] .urlbar-icon { | |
fill: var(--toolbar-color) !important | |
} | |
#urlbar:active #userContext-indicator,#urlbar:active #userContext-label,#urlbar:hover #userContext-indicator,#urlbar:hover #userContext-label,#urlbar[focused] #userContext-indicator,#urlbar[focused] #userContext-label { | |
color: var(--identity-tab-color) !important; | |
fill: var(--identity-tab-color) !important | |
} | |
.urlbar-page-action[open] { | |
background-color: var(--toolbarbutton-active-background) !important; | |
fill: var(--toolbar-color) !important | |
} | |
.urlbar-page-action[open]:hover { | |
background-color: var(--toolbarbutton-active-background) !important; | |
fill: var(--toolbar-color) !important | |
} | |
.urlbar-page-action[open] .urlbar-icon { | |
fill: var(--toolbar-color) !important | |
} | |
.urlbar-scheme { | |
padding-bottom: 11px !important | |
} | |
#urlbar-container { | |
margin-left: -1px !important; | |
margin-right: -1px !important | |
} | |
.urlbar-input-box { | |
padding: 5px 5px !important | |
} | |
#urlbar { | |
background-color: transparent !important; | |
color: var(--lwt-toolbar-field-color, black) !important | |
} | |
#urlbar:not(.hidden-focus)[focused="true"] { | |
background-color: var(--toolbarbutton-hover-background) !important | |
} | |
#pocket-button { | |
padding-bottom: 4px !important | |
} | |
.urlbar-icon-wrapper > .urlbar-icon:hover { | |
background-color: transparent !important | |
} | |
.urlbar-icon-wrapper { | |
background-color: transparent !important; | |
transition: background-color var(--animation-speed) !important | |
} | |
#identity-box:hover,#tracking-protection-icon-container:hover,#urlbar:not([focused]) .urlbar-input-box:hover,.urlbar-icon-wrapper:hover,.urlbar-icon:hover,[anonid=urlbar-go-button]:hover { | |
background-color: var(--toolbarbutton-hover-background) !important | |
} | |
#identity-box:active,#tracking-protection-icon-container:active,.urlbar-icon-wrapper:active,.urlbar-icon:active,[anonid=urlbar-go-button]:active { | |
background-color: var(--toolbarbutton-active-background) !important | |
} | |
#identity-box,#tracking-protection-icon-container,#urlbar,.urlbar-input-box,[anonid=urlbar-go-button] { | |
transition: background-color var(--animation-speed) !important | |
} | |
#identity-box image,#tracking-protection-icon { | |
transition: fill-opacity var(--animation-speed) !important | |
} | |
[lwthemetextcolor="dark"] .urlbarView-body-outer { | |
background-color: #f5f6f7 !important; | |
color: var(--toolbar-color) !important | |
} | |
.urlbarView-body-inner { | |
background-color: var(--toolbar-bgcolor) !important | |
} | |
.downloadsPanelFooterButton:hover { | |
outline: none !important | |
} | |
#context-bookmarklink,#context-navigation,#context-savelink,#context-sendimage,#context-sep-navigation,#context-setDesktopBackground,#context-viewinfo,#context-viewpartialsource-selection,#context_bookmarkTab,#context_moveTabOptions,#context_reloadTab,#inspect-separator,.bookmarks-actions-menuseparator,.openintabs-menuitem { | |
display: none !important | |
} | |
menupopup,menupopup menu,menupopup menuitem,menupopup menuseparator { | |
-moz-appearance: none !important | |
} | |
menupopup:not(#BMB_bookmarksPopup) { | |
padding: 6px 9px 9px !important; | |
margin: -6px -9px 0 !important; | |
border: 0 !important; | |
background: 0 !important | |
} | |
menu[open] menupopup:not(#BMB_bookmarksPopup) { | |
margin: -12px -9px 0 !important | |
} | |
#BMB_bookmarksPopup menu[open] menupopup { | |
transform: translateY(4px) !important | |
} | |
menupopup menuseparator { | |
margin-top: 5px !important; | |
margin-bottom: 5px !important; | |
padding: 0 !important; | |
border-bottom: none !important; | |
opacity: 0.2 !important | |
} | |
.popup-internal-box { | |
background: Menu !important | |
} | |
.popup-internal-box:not(.in-bookmarks-menu) { | |
padding: 6px 0 !important | |
} | |
.panel-arrowcontent { | |
padding-top: 0 !important; | |
border: none !important | |
} | |
.popup-internal-box:not(.in-bookmarks-menu) { | |
border-radius: var(--menu-corner-rounding) !important; | |
box-shadow: 0 2px 9px -3px black !important | |
} | |
.panel-arrowcontainer .panel-arrowcontent,.popup-internal-box,hbox[flex="1"][part="innerbox"] { | |
border-radius: var(--menu-corner-rounding) !important | |
} | |
.in-bookmarks-menu { | |
padding-bottom: 5px !important; | |
padding-top: 5px !important | |
} | |
menu,menucaption,menuitem { | |
-moz-appearance: none !important; | |
height: var(--menu-item-height) !important | |
} | |
menu,menucaption,menuitem { | |
padding-left: 5px !important; | |
padding-right: 5px !important | |
} | |
menu:not(.subviewbutton) > .menu-right { | |
margin-top: 2px !important; | |
margin-right: 0 !important; | |
width: 0 !important | |
} | |
menu:not(.subviewbutton) > .menu-right image { | |
margin-right: -5px !important; | |
margin-top: -2px !important; | |
border: 6px solid var(--toolbar-color) !important; | |
border-top-color: transparent !important; | |
border-right-color: transparent !important; | |
border-bottom-color: transparent !important | |
} | |
panelview toolbarbutton:not(#fxa-manage-account-button) { | |
height: var(--menu-item-height) !important | |
} | |
#BMB_bookmarksPopup .menu-right { | |
height: 23px !important | |
} | |
#customization-uidensity-menuitem-compact,#sidebar-switcher-bookmarks { | |
margin-top: 5px !important | |
} | |
#customization-lwtheme-menu-header { | |
margin-top: 0 !important | |
} | |
@media (-moz-os-version: windows-win7), (-moz-os-version: windows-win8), (-moz-os-version: windows-win10) { | |
.bookmark-item .scrollbutton-up { | |
margin-top: -3px !important | |
} | |
.bookmark-item .scrollbutton-up > .toolbarbutton-icon { | |
margin-top: -2px !important; | |
border: 6px solid MenuText !important; | |
border-top-color: transparent !important; | |
border-right-color: transparent !important; | |
border-left-color: transparent !important | |
} | |
.bookmark-item .scrollbutton-down { | |
margin-bottom: -3px !important | |
} | |
.bookmark-item .scrollbutton-down > .toolbarbutton-icon { | |
margin-bottom: -2px !important; | |
border: 6px solid MenuText !important; | |
border-bottom-color: transparent !important; | |
border-right-color: transparent !important; | |
border-left-color: transparent !important | |
} | |
menu,menucaption,menuitem { | |
padding-left: 5px !important; | |
padding-right: 5px !important | |
} | |
menu:not(.subviewbutton) > .menu-right { | |
margin-right: 0 !important; | |
padding-left: 0 !important | |
} | |
.in-bookmarks-menu { | |
padding-bottom: 5px !important; | |
padding-top: 1px !important | |
} | |
#BMB_bookmarksPopup menu menupopup { | |
transform: translateY(-1px) !important | |
} | |
* { | |
--menu-corner-rounding: 0px; | |
} | |
} | |
@media not (-moz-os-version: windows-win10) { | |
@media not (-moz-os-version: windows-win8) { | |
@media not (-moz-os-version: windows-win7) { | |
hbox[flex="1"][part="innerbox"] { | |
box-shadow: 0px 2px 12px -6px black !important; | |
} | |
.menu-iconic-left { | |
margin: 0px 6px !important; | |
} | |
#BMB_bookmarksPopup menu[open] menupopup { | |
transform: translateY(1px) !important; | |
} | |
#TabsToolbar { | |
-moz-appearance: none !important; | |
background-color: rgba(49,49,58,0.2) !important; | |
background-image: none !important | |
} | |
* { | |
--menu-corner-rounding: 5px; | |
} | |
} | |
} | |
} | |
menu,menucaption,menuitem { | |
color: var(--toolbar-color) !important | |
} | |
.popup-internal-box { | |
background-color: var(--toolbar-bgcolor, Menu) !important | |
} | |
menu[_moz-menuactive="true"]:not([disabled="true"]),menuitem[_moz-menuactive="true"]:not([disabled="true"]),menucaption[_moz-menuactive="true"]:not([disabled="true"]) { | |
background-color: var(--toolbarbutton-hover-background, rgba(127,127,127,0.5)) !important | |
} | |
menu[disabled="true"],menuitem[disabled="true"],menucaption[disabled="true"] { | |
color: var(--toolbarbutton-hover-background, rgba(127,127,127,0.5)) !important | |
} | |
menu[disabled="true"][_moz-menuactive="true"],menuitem[disabled="true"][_moz-menuactive="true"],menucaption[disabled="true"][_moz-menuactive="true"] { | |
background-color: transparent !important | |
} | |
.panel-arrow { | |
fill: var(--toolbar-bgcolor) !important | |
} | |
[lwthemetextcolor="dark"] .panel-arrowcontent,[lwthemetextcolor="dark"] panelview:not([extension]) { | |
background-color: #f5f6f7 !important | |
} | |
.panel-subview-body { | |
background-color: var(--toolbar-bgcolor) !important | |
} | |
#downloadsPanel-mainView { | |
background-color: var(--toolbar-bgcolor) !important | |
} | |
#identity-popup-mainView { | |
background-color: var(--toolbar-bgcolor) !important | |
} | |
#identity-popup-content-blocking-detected { | |
color: var(--toolbar-active-background) !important | |
} | |
#identity-popup-permission-empty-hint { | |
color: var(--toolbar-active-background) !important | |
} | |
.identity-popup-warning-yellow { | |
color: black !important | |
} | |
panel:not([viewId^="PanelUI-webext"]) .panel-arrow { | |
fill: var(--toolbar-bgcolor) !important | |
} | |
.bookmark-item [class^="scrollbutton"] { | |
background-color: var(--toolbar-bgcolor) !important | |
} | |
.theme-body { | |
background: transparent !important | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment