NewFox [Animated]

A minimal Firefox theme with userContent and userChrome.

🦊 I have Blurred my Pins, Weather, extensions and the searchbar in the Screenshot, it has nothing to do with the code.

Important

• Use this configuration only on Firefox 136.0.0 and above, becuase it heavily depends on sidebar.

Tip

• Check out the main features

• The theme is now also at (firefoxcss-store)

• Use nerdfonts

How to Install

Step 1 - Download files

• Download and unzip theme files

Step 1a - Enabling some settigs (should be enabled by defaut if you are using the Fifth version and above if not then do this)

• In the search bar type about:config and make these true =
• privacy.userContext.enabled
• toolkit.legacyUserProfileCustomizations.stylesheets

Step 2 - Installing the files

Linux

• Type = about:support in the search bar.
• Under "Application Basics", find "Profile Directory" and click "Open Directory" in front of it.
• Copy the content of the "NewFox/profile/" directory as is inside and hit replace everything if necessarily.
• Go back to about:support and now under "Application Basics", find "Application Binary" go to that place.
• Copy the "NewFox/defaults" directory , "config.js" and "distribution" as is inside and hit replace everything if necessarily.

Windows

• Type = about:support in the search bar.
• Under "Application Basics", find "Profile Folder" and click "Open Folder" in front of it.
• Copy the content of the "NewFox/profile/" folder as is inside and hit replace everything if necessarily.
• Copy the "NewFox/defaults" folder,"config.js" and "distribution" as is into Firefox main folder (where the Firefox executable is) and hit replace everything if necessarily.

MacOS

• Type = about:support in the search bar.
• Under "Application Basics", find "Profile Directory" and click "Open Directory" in front of it.
• Copy the content of the "NewFox/profile/" folder as is inside and hit replace everything if necessarily.
• Copy the "NewFox/defaults" directory, "config.js" and "distribution" as is inside the main executable at "/Applications/Firefox.app/Contents/Resources/" and hit replace everything if necessarily.

step 3 - Last touch

Linux/macOS

• Type about:profiles
• Find your profile (or every profile) find "Local Directory" and click "Open Directory" close Firefox and delete all files in "startupCache" Directory.

Windows

• Type about:profiles
• Find your profile (or every profile) find "Local Folder" and click "Open Folder" close Firefox and delete all files in "startupCache" folder.

Release notes

1.2.2:

• Fixed the sidebard because it got broken in the 153.0.0 update
• Also made it work on nova mode
• Added policies.json, to enable nova and browser customization by default

1.2.1:

• At version 152.0.0 firefox broke the throbber , so i had to fix it.

1.2.0:

• Homescreen pins are now inspired by liquid glass
• Fixed some svg´s
• Added the toolbar animated items

1.1.0:

• Added the running Knight
• Added userChrome.js to apply javascript
• Disabled some shortcuts that broke my layout (yeah instead of fixing the code i removed the firefox UI elements, call it a skill issue if you want 😇)

1.0.0:

• Based Theme

Warning

At first the vertical tabs will look a little odd there are 2 solutions :

1st => Before installing the files, make vertical tabs as small as possible, by dragging the splitter between the vertical tabs and the main screen to left.

2nd => If you already installed the files, drag the splitter between the vertical tabs and the main screen to left and right until the running knight goes above seperator that should be under it, but this only happen if there are 3 tools maximum at you sidebar.

Note

If the weather widget is not enabled by default, do the following :

Disable "personalize-button.css" in the configs (just delete the file) The pencil icon will get shown up in the home screen right corner. Toggled-on the weather widget then enable the file again (restore the file).

Caution

The running knight is only get shown in the currect position if the firefox is maximized and the screen has a 1.25 zoom, if not it will be displaced, you can ofcurse adapt it to your screen by configuring "side-bar.css" (i will fix it someday)

I also used some code and assets that doesn't belong to me, expand the list below to see the direct link to there original owners.

✨ Sources [Click to expand] 👇

• 0.png, 1.png and 2.png are from this theme = https://addons.mozilla.org/en-US/firefox/addon/praisethesun/

• Icons folder, navbar.css and general.css are from = https://github.com/bmFtZQ/edge-frfox

• Night-Swamp.jpg is the Adobe Premiere pro's 2023 splash screen = https://www.behance.net/gallery/163378813/Adobe-Premiere-Pro-Splash-Screen-2023/modules/921508831

• The js loader is from = https://github.com/Aris-t2/CustomJSforFx

• the 4.png is from = https://aamatniekss.itch.io/fantasy-knight-free-pixelart-animated-character

• liquid-glass inpired by = https://freefrontend.com/css-liquid-glass/

• Coin.png and Chest.png are from = https://itch.io

Star History

Highest so far = 105