A firefox addon that shows currently opened tabs in a sidebar grouped by a privacy container.
In order to use this addon it's recommended to have firefox version >=59 installed. It might work with a version as low as 54, but there were no tests done with these builds. You can download the latest firefox from firefox.com
Installing from addons.mozilla.org
- Visit Container Tabs Sidebar on mozilla.org
- Click Add to Firefox button
- If you have
npm
installed, you can execute the following command:npm run dev
. A Firefox window should open.
- Clone or download a zip of this repository.
- Navigate to
about:debugging
. - Click Load Temporary Add-on.
- Select manifest.json inside
src
directory.
In order to open the sidebar click F2 button on your keyboard. If it doesn't work then open any sidebar (eg. using Ctrl+b), and change the sidebar via dropdown menu.
In order to add/remove containers navigate to about:preferences#containers
.
Summary of How to Create a userChrome.css File on userchrome.org
- Create a file called 'userChrome.css' in a directory called 'chrome' inside your user profile directory
- Add the below data to the file
Warning: Starting with Firefox 69 you have to enable toolkit.legacyUserProfileCustomizations.stylesheets in about:config in order to use modifications listed below.
Note: For Firefox <72 you also need a @namespace
directive at the beginning of the file.
Note: the @namespace
directive only has to appear once in that file.
@namespace url("https://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
See this discussion thread for details.
In order to hide the sidebar header you need to append to the userChrome.css
file the following code:
#sidebar-box[sidebarcommand^="containertabs"] #sidebar-header {
display: none;
}
Before | After |
---|---|
![]() |
![]() |
In order to hide the Tab Bar you need to append to the userChrome.css
the following code:
@namespace url("https://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
#main-window:not([tabsintitlebar="true"]) #TabsToolbar {
visibility: collapse !important;
}
/* for Firefox 72 and beyond */
/* credit to stapuft at https://github.com/piroor/treestyletab/issues/2207#issuecomment-478288590 */
#tabbrowser-tabs, #TabsToolbar {
visibility: collapse !important;
}
This userChrome.css rule will make the icon become black on Toolbar, Sidebar, and Pop up menu
#sidebar-box[sidebarcommand^="containertabs"] #sidebar-header #sidebar-icon,
#sidebarMenu-popup #button_containertabssidebar_maciekmm_net-sidebar-action .toolbarbutton-icon,
#nav-bar-customization-target #containertabssidebar_maciekmm_net-browser-action .toolbarbutton-icon {
filter: invert(100%);
}