Last active
February 11, 2020 11:06
-
-
Save Ede123/5a5dba30bcc2c8d3826b to your computer and use it in GitHub Desktop.
CSS code to get Firefox' Australis theme usable (features: tabs on bottom; rectangular tabs; small space saving back/forward button; tweaked colors in tabbar)
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
/* FIXES TO AUSTRALIS THEME */ | |
/* bookmarks toolbar below adress bar */ | |
#PersonalToolbar { | |
-moz-box-ordinal-group: 2 !important; | |
} | |
/* tabs bar below adress bar and bookmarks toolbar */ | |
#TabsToolbar { | |
-moz-box-ordinal-group: 3 !important; | |
margin: 0 !important; | |
padding: 0 !important; | |
background: transparent !important; | |
} | |
/* tweak menubar design */ | |
#toolbar-menubar { | |
margin: 0 !important; | |
margin-top: 2px !important; | |
padding: 0 !important; | |
padding-left: 16px !important; | |
background: url("chrome://branding/content/icon16.png") 0 50% no-repeat !important; | |
text-shadow: 0 0 0.8em #FFF, 0 0 0.8em #FFF, 0 0 0.5em #FFF, 0 1px 0 rgba(255, 255, 255, 0.5) !important; | |
} | |
/* tweak nav-bar design */ | |
#nav-bar { | |
margin: 0 !important; | |
padding: 0 !important; | |
background: none !important; | |
border: none !important; | |
box-shadow: none !important; | |
} | |
#nav-bar .toolbarbutton-1:not([type=menu-button]), | |
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button, | |
#nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker { | |
padding: 0 !important; | |
} | |
/* show overflow (notably the small arrow when inserting a new tab) */ | |
#navigator-toolbox { | |
overflow: visible !important; | |
} | |
/* shift windows buttons a bit to prevent overlap when Aero is turned off */ | |
@media not all and (-moz-windows-compositor) { | |
#main-window[sizemode="normal"] #titlebar-buttonbox { | |
margin-top: -7px; | |
} | |
} | |
/* de-fog tabbar and invert buttons for better visibility */ | |
#TabsToolbar:not(:-moz-lwtheme)::after { | |
margin: 0 30px !important; | |
box-shadow: 0 10px 20px 20px #fff !important; | |
opacity: 0.5 !important; | |
} | |
#TabsToolbar .tabs-newtab-button, | |
#TabsToolbar #new-tab-button > .toolbarbutton-icon { | |
list-style-image: url("chrome://browser/skin/tabbrowser/newtab-inverted.svg") !important; | |
} | |
#TabsToolbar #alltabs-button[type="menu"], | |
#TabsToolbar .toolbarbutton-1 .dropmarker-icon { | |
list-style-image: url("chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png") !important; | |
} | |
/* rectangular space-saving tabs (partially from http://userstyles.org/styles/99560/square-tab-for-firefox-australis) */ | |
#TabsToolbar .arrowscrollbox-scrollbox { | |
padding: 0 !important; | |
} | |
#TabsToolbar .tabbrowser-tabs { | |
min-height: 26px !important; | |
} | |
#TabsToolbar .tabbrowser-tab { | |
-moz-border-top-colors: none !important; | |
-moz-border-left-colors: none !important; | |
-moz-border-right-colors: none !important; | |
-moz-border-bottom-colors: none !important; | |
border-style: solid !important; | |
border-color: rgba(0,0,0,.2) !important; | |
border-width: 1px 1px 0 !important; | |
border-radius: 2px 2px 0 0 !important; | |
text-shadow: 0 0 4px rgba(255,255,255,.75) !important; | |
background: rgba(255,255,255,.27) !important; | |
background-clip: padding-box !important; | |
} | |
#TabsToolbar .tabbrowser-tab:not[pinned] { | |
margin: 0 !important; | |
} | |
#TabsToolbar .tabbrowser-tab[pinned] { | |
height: 26px; | |
} | |
#TabsToolbar .tabbrowser-tabs[positionpinnedtabs] > .tabbrowser-tab[pinned] { | |
padding-top: 4px !important; | |
} | |
#TabsToolbar .tabbrowser-tab[selected] { | |
background: #EAF2FA !important; | |
background-clip: padding-box !important; | |
border-color: rgba(0,0,0,.25) !important; | |
} | |
#TabsToolbar .tabs-newtab-button { | |
-moz-border-top-colors: none !important; | |
-moz-border-left-colors: none !important; | |
-moz-border-right-colors: none !important; | |
-moz-border-bottom-colors: none !important; | |
border-style: solid !important; | |
border-color: transparent !important; | |
border-width: 1px 1px 0 !important; | |
border-radius: 2px 2px 0 0 !important; | |
text-shadow: 0 0 4px rgba(255,255,255,.75) !important; | |
background: transparent !important; | |
background-clip: padding-box !important; | |
margin: 0 !important; | |
} | |
#TabsToolbar .tabs-newtab-button { | |
border-width: 1px 1px 0 !important; | |
width: auto !important; | |
padding: 0 4px !important; | |
} | |
#TabsToolbar .tabs-newtab-button:hover, | |
#TabsToolbar .tabbrowser-tab:hover:not([selected]) { | |
border-color: rgba(0,0,0,.2) !important; | |
background-color: rgba(255,255,255,.55) !important; | |
} | |
#TabsToolbar .tab-background { | |
margin: 0 !important; | |
background: transparent !important; | |
} | |
#TabsToolbar .tab-background-start, | |
#TabsToolbar .tab-background-end { | |
display: none !important; | |
} | |
#TabsToolbar .tab-background-middle { | |
margin: -4px -2px !important; | |
background: transparent !important; | |
} | |
#TabsToolbar .tabbrowser-tab:after, | |
#TabsToolbar .tabbrowser-tab:before { | |
display: none !important; | |
} | |
#TabsToolbar .tab-throbber:not([pinned]), | |
#TabsToolbar .tab-icon-image:not([pinned]) { | |
-moz-margin-start: -4px !important; | |
} | |
.tab-close-button:not([pinned]) { | |
-moz-margin-end: -4px !important; | |
} | |
#TabsToolbar .toolbarbutton-1 { | |
margin-bottom: -1px !important; | |
} | |
/* hide scroll buttons on tab bar */ | |
.tabbrowser-arrowscrollbox > .scrollbutton-up, | |
.tabbrowser-arrowscrollbox > .scrollbutton-down { | |
display: none !important; | |
} | |
.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-start-indicator:not([collapsed]), | |
.tabbrowser-arrowscrollbox > .arrowscrollbox-overflow-end-indicator:not([collapsed]) { | |
margin-bottom: 0 !important; | |
} | |
/* emulate highlighting of "all tabs" button on new background tab */ | |
.tabbrowser-arrowscrollbox > .scrollbutton-down[notifybgtab] { | |
display: block !important; | |
list-style-image: url(chrome://browser/skin/toolbarbutton-dropdown-arrow-inverted.png) !important; | |
-moz-image-region: auto !important; | |
border: none !important; | |
padding: 1px 6px 0 !important; | |
margin: 0 -46px 0 25px !important; | |
} | |
/* Change the big round back button for a smaller rectangular one */ | |
:root #back-button > .toolbarbutton-icon { | |
-moz-image-region: rect(0, 54px, 18px, 36px); | |
border-radius: 2px 0 0 2px !important; | |
padding: 4px !important; | |
width: 28px !important; | |
height: 28px !important; | |
} | |
@media (min-resolution: 1.1dppx) { | |
:root #back-button > .toolbarbutton-icon { | |
-moz-image-region: rect(0, 108px, 36px, 72px); | |
} | |
} | |
:root #forward-button > .toolbarbutton-icon { | |
padding: 4px !important; | |
width: 27px !important; | |
height: 28px !important; | |
} | |
window:not([chromehidden~="toolbar"]) #urlbar-wrapper { | |
clip-path: none !important; | |
margin-left: 0px !important; | |
} | |
window:not([chromehidden~="toolbar"]) #urlbar-wrapper > #forward-button[disabled] { | |
display: none; | |
} | |
#notification-popup-box[hidden] + #identity-box { | |
padding-inline-start: 5px !important; | |
} | |
#notification-popup-box:not([hidden]) + #identity-box { | |
padding-inline-start: 10px !important; | |
} | |
#urlbar { | |
border-left: 1px solid var(--urlbar-border-color) !important; | |
} | |
#urlbar[focused] { | |
border-color: Highlight !important; | |
} | |
/* hide "PanelUI" button */ | |
#PanelUI-button { | |
display: none !important; | |
} | |
/* hide additional "Bookmarks" button inserted by "Plain Old Favorites" */ | |
#pof-toolbar-menu { | |
display:none!important; | |
} | |
/* make bookmark toolbar's width tiny */ | |
#personal-bookmarks { | |
min-width: 12px !important; | |
max-width: 12px !important; | |
margin-right: 2px !important; | |
} | |
/* don't display click-to-play notification for disabled hidden plugins */ | |
notification[value="plugin-hidden"] { | |
display: none !important; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment