GIF
Window
Fullscreen
-
Download theme files and fx-autoconfig (and read fx-autoconfig install instructions)
-
Install theese extensions Sidebery, Userchrome toggle, Adaptive Tab Bar Color.
-
Go to about: config and set
toolkit.legacyUserProfileCustomizations.stylesheetstotrue. -
Close the browser and install fx-autoconfig following the instructions from its page on github
-
Put
userChrome.css,userContent.cssandJSinto yourchromedirectory.Chrome folder file hierarchy
chrome ├ JS │ └ move-buttons.uc.js ├ utils │ └ important files for fx-autoconfig work ├ userChrome.css └ userContent.css (You can delete `CSS` and `resources` folders because it just examples for fx-autoconfig developers. This folders don't used in this theme) -
Launch Firefox and open Sidebery in sidebar
Check if fx-autoconfig is installed
A new menu item appears
-
Import
sidebery/sidebery-data.jsoninto Sidebery (Sidebery settings > help > import addon data). -
Set first toggle prefix to
-and second toggle prefix to=in Userchrome toggle settings and customize keybinds to what you want.
( This is needed to switch sidebar modes )Userchrome toggle settings
!
- Recomended settings for Adaptive Tab Bar Color (you can experiment with it)
Adaptive Tab Bar Color settings
Optional. Rename your favorite wallpaper to wallpaper.png and put it into chrome folder. It will be shown on new tab page
-
If for some reason you can't install fx-autoconfig (for example on linux it can be difficult), you can use the theme without it, but then the extensions, menu and overflow buttons will be on the bottom panel with urlbar.
-
Doesn't work on ESR and forks based on it. Probably will work when the next major ESR update is released.
-
You can choose how many pinned tabs there will be in one row. To do this, go to Sidebery settings > Styles editor. Select one of the following options there
Styles editor
-
You can choose which side the window control buttons will be on. By default they are on the right, but you can move them to the left. To do this, go to the /* WINDOW CONTROL BUTTONS */ section in the userChrome.css file. There you can do this:
userChrome.css
- Vertical tabs with multiple options (Always visible / Thin sidebar / Show on hover)
- Takes up the least amount of space without taking away functionality
- A floating search menu, roughly like the Arc browser. ( only appears when searching, if you just need to copy the url, the urlbar stays in the bottom bar )
- Compact contextual menus and extensions menu
- Slightly improved new tab page
- Customization screen support ( Usually, themes so radically changing the interface completely break the customization screen )
- Full screen support
- The regular bookmark bar doesn't work, use Sidebery to manage your bookmarks. ( I don't know what can be done with the bookmark bar, if you have ideas, open a issue )
- Make the background colors less flat, add a glow, a blur or something like that
- Do something about the bookmarks toolbar, right now it doesn't work at all
- Maybe replace the protruding edges of the hidden panels with something more interesting
- MrOtherGuy Thanks for the fx-autoconfig and the repository with cool css's.
- MightyFox concept Thanks for the cool concept and main idea
- arcticfox-theme I used this theme as a base to create my own, but there was a bit of commonality left in the process.