W i d e f o x

With monitors getting wider and websites more compact, maximizing the browser is a waste of space. Widefox utilizes all available vertical real estate while adding extra features to your browsing experience!

Preview

v4.mp4

Features

Second sidebar Plus

Nothing would be possible without the script sidebarModoki from alice0775 which creates the second sidebar.

Improved with an unique floating style, matching the browser theme. Giving easy access not only to your Bookmarks, Downloads and History but to your Extensions, Themes, about:performance and about:config!

There are two groups of three tabs for a total of six tabs. To switch between groups either middle click on a tab or click the area above the tabs and under the urlbar.

Max vertical space

Navbar and sidebar width tied together leaving all the vertical space available for each webpage, urlbar will also expand on when needed.

Tree Style Tab styling

Restyling tabs to match the floating styling of proton redesign, adds light/dark mode awarenesses, an animated border and various other tweaks.

Smart window resize

Switching from/to normal/maximized window will hide/show the sidebar automatically.

Extras

Styles

Normal size window restyle

One-line style with no tabs since TST is used. Complete optional you can modify sidebarXautohidet.uc.js (just uncomment some lines) to auto-hide TST completely on normal size window.

File: .\userChrome-files\normal_mode.css

Darker about:pages for dark mode users

Recolours most about:pages and breaks the monochrome background.

File: .\userContent-files\aboutpages\about_pages_Darker.css

About:addons restoration

Utilize the wasted screen space, bring back buttons and other useful additions!

Files at .\userContent-files\aboutpages\aboutaddons folder keep what you prefer.

Scripts

About:addons search-box searches your addons

Filter your extensions and themes instead of searching the store.

File: addonSearchBar.uc.js

Restart button on toolbar and main menu

One click restart.

Files : restartButtonM.uc.js and restartInMenu.uc.js

Restore the restore previous season on the main menu

Proton redesign took it away now you can have it back.

File: restoreRestorePreviousSeason.uc.js

Show only domain on urlbar

Hide and restore on focus. Use with caution.

File: trimurl.uc.js

Floating scrollbars

File: floatingScrollbar.uc.js

Installation

1. Install Tree Style Tab

Select left side style from TST Options-> Appearance
Click the sidebar header and select Move Sidebar to Right

2. Install TST Colored Tabs to get per domain colours

In options select Saturation 60 and Lightness 22 and then add your preferred colours for each domain or leave it to random if you want.

3. Unlock custom css settings

Go to about:config search for toolkit.legacyUserProfileCustomizations.stylesheets and set it to true
For blur support search for layout.css.backdrop-filter.enabled and set it to true ! Not working in latest version of Firefox !

4. Enable script support

In-order to support custom scripts an autoconfig script loader is needed. Tested with the loader from xiaoxiaoflood. Follow the instructions to install the loader from https://github.com/xiaoxiaoflood/firefox-scripts

5. Install Widefox

Copy the contents of the chrome folder from this repository to the chrome folder you created inside your profile folder in step 4.
Restart!
If there is a thin line at the top of the window in maximized mode or a part of the window disapears, increase/decrease the value of the variable --titlebar-hide in the file userChrome-files/vars.css

6. Customize Toolbar

Right click on any toolbar and select Customize Toolbar... or from Main menu > More Tools > Customize toolbar...
Click here for more details...

Make sure there is one spacer on the left side of urlbar and none on the right. Move the sidebar Modoki hide/show button to the vertical toolbar, move the reload and restart buttons where you want. Move extensions and other buttons from either side of urlbar to the vertical toolbar or to overflow menu. Make sure there is at least one thing inside the overflow menu. If you want the zoom control buttons you can bring them to the vertical toolbar. Compact mode is recommended, enable browser.compactmode.show in about:config and set density to compact.

Here is a before and after from a default profile:

7. Finished!

Startpage/Newtab page in preview
Color theme in preview

ATechnocratis/widefox