[SOLVED] Make NewTabPage change color in Firefox-ESR?

[Xeno Idaltu]

Debian Buster
KDE Plasma
Firefox-ESR 60.9

I recently moved to Debian full-time.
I could install the newest non Firefox-ESR version but all the things I use work on Firefox-ESR so I want to keep it.
However, the NewTabPage won't turn to the desired color I want it to be. The vast majority of Firefox themes found on it's site don't even have the option to change the color of the NewTabPage, therefore I had to create my own plug-in which works great on the latest versions of Firefox. This morning I tried my plug-in on Firefox-ESR but still leaves the NewTabPage as a white background.

The most logical way would be to use Dark-Breeze GTK3, but on Firefox-ESR the NewTabPage still keeps itself white.


Does anyone have a Dark Theme plug-in and/or GTK3 Theme customized for Firefox-ESR?

[L_V]

You can try this:

1 - add Tab-Flag extension: https://addons.mozilla.org/fr/firefox/addon/tab-flag/

2 - create or modify <Firefox_user_profile>/chrome/userChrome.css

Code: Select all

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

.tabbrowser-tab[titlechanged]:not([selected="true"]) { color: rgb(220,20,60) !important; }

[Xeno Idaltu]

Didn't work..

Other alternative?

[L_V]

It works for firefox 68.1.0esr.

Code: Select all

firefox -version
Mozilla Firefox 68.1.0esr

Chrome is now disabled by default.
Check in about:config that toolkit.legacyUserProfileCustomizations.stylesheets is set to true.
+ feedback of this:

Code: Select all

grep -r selected ~/.mozilla/firefox/*/chrome/

Not 100% sure when chrome changes have been introduced.
Previously, this worked:

Code: Select all

/* Change color of not visited inactive tabs */
.tabbrowser-tab:not([visited]) {
 color:#c09!important; font-style:normal!important;
 font-size:10pt!important;
 font-weight:bold!important;
}

I admit some confusion in firefox chrome evolution.

+ I suppose your goal is to highlight the "unvisited" tabs, loaded in background.
If you just open a tab (not in background), this "new" tab is just your current tab.

[Xeno Idaltu]

I was refering to the background color/text of the page when we open a new tab.

I found this instead:

1) Make "chorme" directory and file "userContent.css"

Inside userContent.css

Code: Select all

@-moz-document url("about:home"),
url("about:newtab") {
    .search-wrapper,
    .tile {
        box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22) !important;
    }
    .card-outer {
        border-radius: 15px !important;
        box-shadow: 0 19px 38px rgba(0, 0, 0, 0.30), 0 15px 12px rgba(0, 0, 0, 0.22) !important;
    }
    html {
        height: 100% !important
    }
    body {
        background: -moz-linear-gradient(138deg, rgb(88, 85, 158) 0%, rgb(141, 62, 146) 20%, rgb(187, 59, 75) 80%) !important;
        height: 100% !important;
        margin: 0 !important;
        background-repeat: no-repeat !important;
        background-attachment: fixed !important;
    }
    .title,
    .section-title span,
    .topic,
    .edit-topsites-wrapper .edit-topsites-button button {
        color: white !important; /*title color */
    }
    .section-title span, .prefs-pane-button button {
        fill: white !important;
    }
    .topic .topic-link, .topic .topic-read-more {
        color: white !important; /*text color */
    }
}