Last active
July 19, 2021 21:16
-
-
Save eudennis/b11e3757444ba0a74a80f5c085b75a29 to your computer and use it in GitHub Desktop.
Firefox 80+ with tabs on bottom
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
/* | |
https://github.com/Arty2/userstyles | |
@version 0.2.0 | |
1. Navigate to `%APPDATA%\Mozilla\Firefox\Profiles` (you can copy/paste this) or locate the exact directory by visiting `about:profiles`. | |
2. Create a folder named `chrome` then create a file named userChrome.css inside it and paste this code. | |
3. If userChrome.css doesn’t seem to work, open `about:config` and set `toolkit.legacyUserProfileCustomizations.stylesheets=true`. | |
4. Recommend to activate the "Title Bar" on your Firefox Toolbar to still have access to "Minimize and Close" buttons | |
Other references: | |
Firefox Support forum - Tabs below the URL bar: https://support.mozilla.org/en-US/kb/forum-response-tabs-below-url-bar | |
Custom CSS tweaks for Firefox Quantum: https://github.com/Aris-t2/CustomCSSforFx | |
*/ | |
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul); | |
/* | |
Firefox 69+ need to activate the userChrome.css | |
https://www.userchrome.org/firefox-changes-userchrome-css.html#fx69 | |
*/ | |
/* | |
tabs to bottom | |
source: https://gist.github.com/Arty2/e6e61801531ec5ee1f9f | |
*/ | |
/* bring the browser window to the top */ | |
#browser { | |
-moz-box-ordinal-group: 0 !important; | |
} | |
/* alternative: move the toolbar to the bottom; */ | |
/* #appMenu-viewCache + box { | |
-moz-box-ordinal-group: 2 !important; | |
} */ | |
/* hide tab toolbar when fullscreen */ | |
#nav-bar[inFullscreen], | |
#TabsToolbar[inFullscreen] { | |
display: none; | |
} | |
/* hide titlebar buttons */ | |
#TabsToolbar > .titlebar-buttonbox-container { | |
display: none !important; | |
} | |
/* Moving the status bar to right and adding margin */ | |
.browserContainer > #statuspanel{-moz-box-ordinal-group:0!important;bottom:80px !important;right:10px!important} | |
/* Remove drag tab when not Maximezed */ | |
.titlebar-placeholder[type="pre-tabs"], | |
.titlebar-placeholder[type="post-tabs"] { | |
display: none !important; | |
width: 0px !important; | |
max-width: 0px !important; | |
} | |
.titlebar-spacer[type="pre-tabs"], | |
.titlebar-spacer[type="post-tabs"] { | |
display: none !important; | |
width: 0px !important; | |
max-width: 0px !important; | |
} | |
/* URL will popup on top when focused */ | |
#urlbar[focused=true] { | |
margin-top:-90vh!important; | |
} | |
/* Remove scrollbars */ | |
:-moz-any(#content,#appcontent) browser{ | |
margin-right:-5px!important; | |
overflow-y:scroll; | |
overflow-x:scroll; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment