EdgyArc-fr
Because Arc and Edge look pretty af but FOSS FTW
Prerequisites
The following is only valid from v1.0.0.b.10 onwards!
Features
- Based on Edge-frfox
- Sidebar Modifications
- Auto-collapse sidebar into just icons
- Auto-hide sidebar
- Toggle sidebar show/collapse (using UserChrome Toggle)
macOS only
Translucent windows
- Custom Sidebery theme
- Auto-hide native top tabs when Sidebery or TST is active
Usage
Step 1 - Prerequisites
🔵 Install recommended addons
- [Sidebery](https://addons.mozilla.org/firefox/addon/sidebery/)
- [UserChrome Toggle](https://addons.mozilla.org/firefox/addon/userchrome-toggle/) `Required for sidebar autohide`
- [Adaptive Tab Bar Colour](https://addons.mozilla.org/en-GB/firefox/addon/adaptive-tab-bar-colour/)
🔵 Install and Configure Base theme
- Clone or download the repository to your local machine.
- Copy the contents of the `chrome` folder into your Firefox profile's `chrome` folder.
- Enable/Add the following settings in `about:config` to enable some base features
**Make sure to initialise all of these as Booleans**
`uc.tweak.hide-tabs-bar` to `true`
`uc.tweak.hide-forward-button` to `true`
`uc.tweak.rounded-corners` to `true`
`uc.tweak.floating-tabs` to `true`
- Please make sure you also have the following perquisites set to `true`
`toolkit.legacyUserProfileCustomizations.stylesheets`
`svg.context-properties.content.enabled`
`layout.css.color-mix.enabled`
`layout.css.light-dark.enabled`
`layout.css.has-selector.enabled`
`widget.macos.titlebar-blend-mode.behind-window` [Required for translucent macos in FF126+]
Step 2 Configure EdgyArc
Before you start using the theme as-is, you might want to have a look at all the style variants built into EdgyArc-fr
Feature Description |
Screenshot |
Translucent Effects macos Only af.edgyarc.macos-translucent |
|
More Translucent ⚠️ Decreased text contrast/visibility af.edgyarc.macos-more-translucent |
🔵 UI Tweaks |
|
Thin Navigation Bar af.edgyarc.thin-navbar |
|
Minimal Navigation Bar af.edgyarc.minimal-navbar |
|
Greyscale webextensions icons uc.tweak.af.greyscale-webext-icons |
|
Centered URL
af.edgyarc.centered-url |
|
🔵 Sidebar Tweaks ⚠️ Note: Requires UserChrome Toggle to make use of auto-collapse/auto-hide |
Enable Sidebery Theme af.sidebery.edgyarc-theme |
|
Minimal Sidebery when Collapsed af.sidebery.minimal-collapsed |
|
Edge-like Sidebar af.edgyarc.edge-sidebar |
|
Show Sidebar Header af.edgyarc.show-sidebar-header |
|
Auto-Hide Sidebar af.edgyarc.autohide-sidebar Note: Requires UserChrome Toggle to work |
|
Sidebar Always Collapsed af.edgyarc.sidebar-always-collapsed Note: Requires UserChrome Toggle to work |
|
Wider Expanded Sidebar on Hover uc.tweak.af.sidebar-width-350 |
Sidebery Horizontal Navbar on Top Tab List af.sidebery.nav-on-top |
Disable Dynamic Width Pinned Tabs
af.sidebery.static-pinned-tab-width |
Step 3 - Import Sidebery configs
Import the following into sidebery (Sideberry Settings
> Help
> Import Addon Data
)
Step 4 - Set up Adaptive Tab Bar Color settings
Known Bugs
windows
Translucency / blur does not work on windows
linux
Translucency / blur does not work out of the box
windows
linux
macos
Sidebar on right is misaligned
Screenshots
Changelog
-
v1.0.0-b10
- Support for FF126 [for FF125 and lower, please continue using v1.0.0-b9]
- Rewrote a large chunk of the code
- Included copy of Edge-frfox (v 24.4.18) for fewer version compatibility issues
-
v1.0.0-b9
- New
- Added Thin navbar variant
uc.tweak.af.thin-navbar
- Fixed
- Sidebery CSS (default background for pinned tabs)
- Titlebar Controls positioning
-
v1.0.0-b8
- Fixed
- findbar background colour when using firefox color/adaptive tab bar color addons
- tab notification deck translucency
macOS
- toolbar height
- padding in urlbar+reload button combo
- Positioned window controls
Windows 10/11
- private window indicator
Windows 10/11
- Tweaks
- uc.tweak.af.no-dimming makes sidebar have 100% opacity.
Prequisite : translucency must be disabled using uc.tweak.af.not-translucent #14
- tweaked margins and paddings
Windows 10/11
-
v1.0.0-b7
- Cleaned up code
- Fixed sidebery css bug - dragging tabs would indicate incorrect drop location
- fixed sidebery css bug - pinned tabs misaligned
- Added feature - Show a styled sidebar header
uc.tweak.af.show-sidebar-header
> true
- Added feature - Turn all web extension icons greyscale when not hovered
uc.tweak.af.greyscale-webext-icons
> true
- Css tweak - Toolbar background images now fade away at the bottom so it doesnt look jarring
- Css fix - show custom private window badge when tabbar is hidden
- Css fix - fixed margins and paddings of buttons inside the urlbar
- bug fix - extension dropdown sheets inside the urlbar now show properly when urlbar is not hovered
-
v1.0.0-b6
- cleaned up code
- bugfixes
- updated sidebery styles
-
v1.0.0-b5
- Rewritten most of the code for translucency in macos
- Added new preference uc.tweak.af.hidden-sidebar to fully hide sidebar when autohde is turned on in Userchrome Toggle
- Added new preferenceuc.tweak.af.translucent-enable to control translucency [mac only]
- Added new preference uc.tweak.af.translucent-enable to enable arc-like translucent sidebar
- Tweaked sidebery css
-
v1.0.0-b4
- Supports Adaptive Tab Bar Color in translucent windows enabled!
-
v1.0.0-b3
- restyled horizontal navigation bar to make it look less crappy
- coloured tabs only show colour behind favicon, and not the whole row
- expand tab group icon now more visible
-
v1.0.0-b2
- added translucency support on macos
- changed hover opacities and transitions on navigator-toolbox
- fixed search bar placement in sidebery css
- fixed 1px bug in sidebery css
-
v1.0.0-b1
-
initial release
Issues and Contributions
If you encounter any issues or have suggestions for improvement, please open an issue. Contributions are always welcome!
License
This project is licensed under the Mozilla Public License 2.0.