Join Us and become a Member for a Verified Badge on Discord to access private areas with the latest PS4 FPKGs.
Random Stuff       Thread starter PSXHAX       11617       3

PSXHAX

Staff Member
Moderator
Verified
Here's my brief guide on How to Make the New Firefox 57 Quantum Browser Look Like the Older Firefox 56 Browser, since the Classic Theme Restorer is currently not compatible with Firefox Quantum and I didn't want to wait for someone else to revise their add-on.

After searching the Interwebs I ran across the Photon Australis Github project by wilfredwee which I borrowed some code from in my userChrome.css file below. :geek:

I would have skipped this guide and simply used his CSS file, but upon testing it opening new tabs and hovering between them in Firefox 57 ends up 'jumpy' so I pressed onward instead of trying to sort out the margin, padding, etc issues in the code. :confused:

Before updating to Mozilla's new Firefox 57 Quantum I was on Firefox 56.0.2 which looked clean and simple like this:

FireFox56.png

After installing Firefox 57 Quantum (along with enabling the 'Menu Bar' and manually moving some buttons around in the 'Customize Firefox' menu) I'm still left with this fugly UI:

FireFox57.png

So I navigated to Open Menu (click on the Firefox Hamburger Menu Icon) then Add-ons followed by Themes and Enabled Light there.

Next I opened a new tab in Firefox and typed in: about:profiles and clicked on the 'Open Folder' button for the Root Directory which popped up the folder in Windows Explorer.

There I created a new folder called chrome (since one didn't exist already) and inside it I right-clicked, selected New and then Text Document and named it userChrome.css

Then after some Googling I put together this code which I pasted into the userChrome.css file I just created and saved it:
Code:
/* Make Firefox 57+ Like Firefox 56 Tweaks */
/* Borrowed code from https://github.com/wilfredwee/photon-australis */

:root {
  --tabs-border: transparent !important;
}

   /* tab top border roundness */
   #TabsToolbar .tabs-newtab-button,
   #TabsToolbar .tabbrowser-tab,
   #TabsToolbar .tabbrowser-tab .tab-stack,
   #TabsToolbar .tabbrowser-tab .tab-background,
   #TabsToolbar .tabbrowser-tab .tab-content {
       border-top-left-radius: 15px !important;
       border-top-right-radius: 15px !important;
       border: none; !important;
   }

   /* remove colored line above each tab */
   #TabsToolbar .tabbrowser-tab .tab-line {
       visibility: hidden;
   }

   /* remove page actions ... button */
   .urlbar-page-action {display: none !important;}

   /* top and tab background and font colors */
   #toolbar-menubar, #menubar-items, #main-menubar {
   background-color: #c7c7c7 !important;
   color: #000000 !important;
   background-image: none !important;
   }

   .tabbrowser-tab .tab-label {color: #000000 !important;}
   .tabbrowser-tabs  {background: #c7c7c7 !important;}
   .tab-close-button {color: #000000 !important;}

   #main-window .tabs-newtab-button,
   #main-window #TabsToolbar #new-tab-button > .toolbarbutton-icon {color: #000000 !important;}

   /* Hide "Send Link to Device" and separator */
   #contentAreaContextMenu #context-sendlinktodevice,
   #contentAreaContextMenu #context-sep-sendlinktodevice {display: none !important;}

   /* Hide "Search" and separator */
   #context-searchselect {display: none !important;}
Granted some of it hides right-click context menu options I personally don't use that get in my way, but nevertheless here's the result after I restarted Firefox 57 Quantum for the changes to take effect:

FireFox57 Fixed.png

Back to the clean and simple look I prefer, and that I've been used to for many years prior to the Firefox Quantum 57.0 update. (y)

So there you have it folks, and since Firefox 56.0.2 is no longer considered 'safe' by most to use, if anyone reading this doesn't want to go through the above tutorial steps and wishes to downgrade Firefox 57 Quantum you can safely revert to 52.5.0 ESR which will continue getting security updates until May, 2018.

:arrow: Update: After updating to Firefox 59.0.1 I had to further tweak some of the above mods, here's my current userChrome.css file:
Code:
/* Make Firefox 57+ Like Firefox 56 Tweaks */
/* Borrowed code from https://github.com/wilfredwee/photon-australis */

:root {
  --tabs-border: transparent !important;
}

   /* tab top border roundness */
   #TabsToolbar .tabs-newtab-button,
   #TabsToolbar .tabbrowser-tab,
   #TabsToolbar .tabbrowser-tab .tab-stack,
   #TabsToolbar .tabbrowser-tab .tab-background,
   #TabsToolbar .tabbrowser-tab .tab-content {
       border-top-left-radius: 15px !important;
       border-top-right-radius: 15px !important;
       border: none; !important;
       margin-right: .03em !important;
   }

   /* remove colored line above each tab */
   #TabsToolbar .tabbrowser-tab .tab-line {
       visibility: hidden;
   }

   /* curved tabs */
.tabbrowser-tab[selected="true"]::before
{
  border: 1px none !important;
  opacity: 1 !important;
}

.tabbrowser-tab[selected="true"]::after
{
  border: none !important;
  opacity: 1 !important;
}

.tab-background
{
  border-top: 1px solid #9f9fa1 !important;
  border-right: 1px solid #9f9fa1 !important;
  border-left: 1px solid #9f9fa1 !important;
  opacity: 0.7 !important;
}

.tabbrowser-tab::after {

  border: none !important;
  opacity: 1 !important;
}

.tabbrowser-tab[last-visible-tab]::after
{

  border: none !important;
  opacity: 1 !important;
}

   /* remove page actions ... button */
   .urlbar-page-action {display: none !important;}

   /* top and tab background and font colors */
   #toolbar-menubar, #menubar-items, #main-menubar {
   background-color: #e3e4e6 !important;
   color: #000000 !important;
   background-image: none !important;
   }

   .tabbrowser-tab .tab-label {color: #000000 !important;}
   .tabbrowser-tabs  {background: #e3e4e6 !important;}
   .tab-close-button {color: #000000 !important;}

   #TabsToolbar .tabbrowser-tab[selected] {
   background: rgba(245, 246, 247, 100) !important;
   border-bottom: none !important;
   }

   #main-window .tabs-newtab-button,
   #main-window #TabsToolbar #new-tab-button > .toolbarbutton-icon {color: #000000 !important;}

   /* Hide "Send Link to Device" and separator */
   #contentAreaContextMenu #context-sendlinktodevice,
   #contentAreaContextMenu #context-sep-sendlinktodevice {display: none !important;}

   /* Hide "Search" and separator */
   #context-searchselect {display: none !important;}

   /* Hide "Email Image" and separator */
   #context-sendimage {display: none !important;}

   /* Hide Send Link... (when you right-click on link)*/
   #context-sendlink{display:none !important;}

   /* Hide "Fill Login" (when you click a login box) */
   #fill-login-separator, #fill-login{display: none !important;}

   /* Hide Context Menu Separators */
   #contentAreaContextMenu menuseparator{display: none !important;}
:arrow: Update #2: After updating to Firefox 70.0.1 I had to re-enable the Light theme by navigating to Open Menu (click on the Firefox Hamburger Menu Icon) then Add-ons followed by Themes and Enabled Light there.
 
Recent Articles
PS5 PKGs Surface: Include Share Factory Studio for Scene Devs to Examine!
Following the recent PS5 UI / UX Unveiling and PS5 XML List updates we now have reports of the first PS5 PKGs surfacing, including a Share Factory Studio PS5 Package for PlayStation 5 Scene...
PS5 Unboxing Videos and PlayStation 5 Games Live on Sony's Servers!
As predicted a few days ago, many are bypassing the October 30th release date for PS5 accessories and mainstream media is already receiving PlayStation 5 consoles for press unboxing revealing the...
PlateStation5.com: Custom PS5 Replacement Faceplates for PlayStation 5
Ever since the PS5 was officially unveiled by Sony, many longtime PlayStation fans criticized that the white exterior shell should be black like the PS5 Prototype Images that surfaced... as a...
Sony Unveils PS5 Launch Day Media Entertainment Streaming Apps
While nothing compares to Plex Media Server for streaming ALL my favorite Films / Movies & TV Shows free forever instead of paying monthly subscription fees to watch the same content available via...
Top