Si vous aimez le mode sombre pour une navigation nocturne agréable pour les yeux et que vous aimez également Mozilla Firefox, vous avez probablement rencontré un problème: l’ouverture de nouveaux onglets et le chargement de nouvelles pages vous aveuglent. Voici comment rendre les nouveaux onglets compatibles avec le mode sombre.

Le Mode Sombre Est Génial, mais Le “Flash” Blanc Ne L’Est Pas

Il y a un problème avec le mode sombre de Firefox qui persiste, malgré diverses corrections de bugs au cours des dernières années. Si vous n’êtes pas un utilisateur dévoué du mode sombre, vous ne connaissez peut-être pas ce problème. Si vous l’êtes—et je le suis certainement—vous êtes probablement ravi de découvrir qu’il existe une solution simple qui fonctionne, que le bogue soit complètement écrasé ou non.

Le problème? Même si vous avez Firefox en mode sombre, chaque fois que vous ouvrez un nouvel onglet vide, il est aveuglément blanc.

Pire encore, même lorsque vous chargez une page Web qui prend en charge le mode sombre, il y a un bref “flash” où l’arrière-plan blanc par défaut vous projette une lumière blanche brillante avant le chargement de la page.

Cela peut ne pas sembler être la fin du monde, mais lorsque vous avez soigneusement réglé votre espace de travail spécifiquement pour éviter que votre moniteur très lumineux ne vous explose au visage avec une lumière blanche vive, c’est un peu choquant.

Alors oubliez d’être surpris tard dans la nuit pendant que vous travaillez paisiblement en mode sombre. Déployons un correctif simple pour nous assurer que ces attaques sournoises à haute luminosité appartiennent au passé.

Comment empêcher le menu de téléchargement de Firefox de s’afficher ?

Oubliez Les Extensions De Navigateur, Modifiez Plutôt Votre Chrome

En ce qui concerne votre navigateur Web, si vous pouvez résoudre quelque chose de la manière la plus simple possible en utilisant le moins de risques possible, c’est toujours pour le mieux. Les extensions de navigateur sont un cauchemar en matière de sécurité et de confidentialité.

Bien que vous n’ayez pas à les éviter complètement, il est sage de ne s’en tenir qu’aux modules complémentaires et aux extensions correctement examinés et vérifiés. C’est toujours une valeur sûre d’éviter les extensions aléatoires d’auteurs inconnus.

Dans cet esprit, nous étions vraiment heureux de trouver un moyen incroyablement simple de résoudre notre problème sans avoir à rechercher (et revoir le code de) une extension codée sur mesure pour la tâche.

La solution? Profitant d’un petit outil de modification de navigateur pratique intégré directement dans Firefox, le userChrome.css et userContent.fichiers css.

Si vous séparez ce premier nom de fichier, vous avez une idée de ce que nous sommes sur le point de faire, il s’agit d’une feuille de style fournie par l’utilisateur pour Chrome du navigateur. (Le navigateur Web Chrome est en fait nommé d’après le navigateur chrome, et c’est un peu une blague, à ce sujet.) Nous allons également, au nom de la rigueur, modifier le contenu utilisateur.css aussi.

Activer la Prise En Charge des Styles Hérités

Avant toute chose, nous devons activer un paramètre de configuration pour que notre petit ajustement prenne réellement effet. Si vous ne faites pas cette étape, vous vous arracherez les cheveux de frustration alors qu’aucun des changements que nous apportons ne fait rien.

Lancez Firefox et tapez about: config dans la barre d’adresse. Ignorez l’avertissement s’il apparaît. Utilisez le champ de recherche pour rechercher toolkit.legacyUserProfileConfigurations.feuilles de style . La valeur par défaut est false, double-cliquez sur l’entrée pour la définir sur true.

Localisez Votre Répertoire De Profil

Tout d’abord, nous devons localiser où se trouvent les fichiers de configuration de votre installation particulière de Firefox. Lancez Firefox et tapez about: profiles dans la barre d’adresse. Cela listera tous les profils de votre navigateur Firefox et fournira un lien direct pratique vers le répertoire racine de votre profil.

Sélectionnez le profil sur lequel vous souhaitez effectuer ce réglage en mode sombre et cliquez sur le bouton « Ouvrir le dossier “à côté de l’entrée de liste pour « Répertoire racine ».”

Pour les utilisateurs de Windows, ce répertoire ressemblera à quelque chose comme C:\Users[YourUserName]\AppData\Roaming\Mozilla\Firefox\Profiles[ProfileName] où YourUserName est votre nom d’utilisateur Windows et ProfileName est une chaîne alphanumérique générée par Firefox comme fxxd088p. default-release .

Créer un Répertoire Chrome et des Fichiers de Style

Si vous recherchez des solutions de feuille de style à ce problème particulier, il existe plusieurs variantes—certaines inutilement complexes—mais nous utilisons les extraits de code très simples partagés par l’utilisateur de github gmolveau depuis des années avec beaucoup de succès et vous recommandons de faire de même.

Dans le répertoire de profil, créez un nouveau sous-répertoire appelé chrome. Nous allons créer deux fichiers de feuille de style dans ce répertoire.

Créez un nouveau document texte vierge dans ce répertoire et collez-y le code suivant:

couleur d’arrière-plan: rvb(19,19,20) !important; }
couleur de fond du navigateur: #131314 !important; }

Enregistrez le fichier avec le nom userChrome.CSS. Ce morceau de code corrigera le scintillement blanc brillant qui se produit entre les chargements de page.

Créez un autre document texte vierge et collez ce code:

@ – moz-préfixe d’url de document (à propos:vide) {
html > corps: vide {
couleur de fond: rvb (19,19,20) !important;
}
}
@ – moz-url du document (à propos: vide) {
html > corps: vide {
couleur de fond: rvb (19,19,20) !important;
}
}

Enregistrez le fichier avec le nom userContent.CSS. Ce morceau de code garantira que les onglets vides sont d’un gris très foncé et non d’un blanc brillant.

Vous pouvez remplacer le gris en sourdine par n’importe quelle couleur de votre choix en utilisant les codes RVB et hexadécimaux appropriés. Si vous vouliez du noir de jais, par exemple, vous pouvez remplacer chaque instance de 19,19,20 ci-dessus par 0,0,0 et chaque instance de #131314 par #0A0A0A.

Ou, si vous vouliez voter pour l’anarchie totale, nous supposons, vous pouvez opter pour le vert fluo: 117,225,51 #75FF33 . Quel que soit votre désir de couleur, vous pouvez utiliser un simple sélecteur RVB pour sélectionner les bons codes.

Une fois que vous avez créé les fichiers, redémarrez simplement Firefox pour que les modifications prennent effet (si elles ne prennent pas effet, assurez-vous d’avoir activé la prise en charge héritée comme indiqué dans la première étape).

Maintenant, vous pouvez le tester. Vous pouvez vérifier la couleur de l’onglet vide dans votre installation de Firefox en tapant about: blank dans la barre d’adresse.

Tester le chargement de la page “flash  » est un peu plus délicat. Le moyen le plus simple de le tester est de visiter une page Web et d’ouvrir quelques liens à partir de cette page dans de nouveaux onglets.

Parfois, il est difficile à attraper, en particulier sur une connexion rapide à une page Web optimisée, mais si vous en chargez quelques—uns, vous devriez pouvoir attraper le changement de couleur-dans la capture d’écran ci-dessus, vous pouvez voir comment le flash de couleur entre les chargements de page n’est plus blanc mais le gris sourd que nous avons sélectionné.

Si, après tout cela, vous avez vraiment le mode sombre à l’esprit, c’est le moment idéal pour activer le mode sombre partout.