Comment obtenir le thème de conception de matériaux Google Chrome dans Firefox

Si vous n'aimez pas l'apparence des coins carrés des onglets dans Firefox, vous pouvez leur donner l'aspect arrondi de l'interface utilisateur de conception matérielle de Chrome.

Si vous n'aimez pas le look du carrédans les coins des onglets de Firefox, vous pouvez leur donner l'aspect arrondi de l'interface utilisateur de conception matérielle de Chrome. Vous pouvez également mettre des extrémités arrondies sur la barre d'adresse et convertir les icônes de la barre d'outils Firefox en icônes Material Design. Aujourd'hui, nous allons vous montrer comment vous pouvez obtenir l'interface utilisateur de conception matérielle de Chrome dans Firefox.

Avant de passer à l'interface utilisateur de Material Design

Voici à quoi ressemblent les onglets et les icônes de Firefox avant d'appliquer l'interface utilisateur de Material Design à Firefox:

Onglets carrés dans Firefox, avant d'appliquer l'interface utilisateur de Material Design

Nous allons maintenant appliquer l'interface utilisateur de Material Design à Firefox et obtenir des coins arrondis et les icônes de conception de matériaux.

Téléchargez et extrayez les fichiers requis

Téléchargez le fichier zip MaterialFox pour obtenir les fichiers requis.

Cliquez sur Cloner ou télécharger sur la page Web, puis sur Télécharger le ZIP. Enregistrez le fichier dans un dossier de votre disque dur.

Télécharger le fichier zip MaterialFox

Extrayez les fichiers à l'aide de l'outil d'extraction intégré dans Windows ou d'un outil tiers comme 7-Zip ou WinZip.

Extraire le fichier zip MaterialFox

Si vous utilisez l'outil d'extraction intégré de Windows, cliquez sur Feuilleter pour choisir un emplacement de téléchargement.

Vérifier la Afficher les fichiers extraits une fois terminé pour ouvrir une fenêtre du Gestionnaire de fichiers directement dans le dossier téléchargé lorsque l'extraction est terminée. Cliquez sur Extrait.

Boîte de dialogue Extraction de Windows 10

Ouvrez votre dossier de profil Firefox

Nous allons copier le chrome dossier du MatérielFox-master dossier que nous avons téléchargé. le chrome le dossier contient userChrome.css fichier utilisé pour appliquer l'interface utilisateur de Material Design à Firefox. Mais, tout d'abord, vérifions si vous avez déjà un chrome dossier et votre propre personnalisé userChrome.css fichier dans votre dossier de profil Firefox.

Pour ouvrir votre dossier de profil, tapez (ou copiez et collez) le chemin suivant dans la barre d'adresse de l'Explorateur de fichiers et appuyez sur Entrée.

% appdata% MozillaFirefoxProfiles

Coller le chemin du profil dans l'Explorateur de fichiers

Vous pouvez également accéder à votre dossier de profil depuis Firefox.

Type: à propos de: support dans la barre d'adresse et appuyez sur Entrer.

Ou, vous pouvez aller à Menu Firefox> Aide> Informations de dépannage et puis, sous Principes de base de l'application, Cliquez sur Dossier ouvert à côté de Dossier de profil.

Ouvrir le dossier de profil dans Firefox

Votre profil Chrome s'ouvre dans une nouvelle fenêtre de l'Explorateur de fichiers. Laissez cette fenêtre ouverte.

Modifier un fichier userChrome.css existant

Si vous n'avez pas encore de dossier Chrome dans votre dossier de profil, passez à la section suivante.

Si tu as un chrome dossier dans votre dossier de profil et un userChrome.css fichier dans le dossier Chrome, puis nous modifierons le fichier existant userChrome.css fichier. De cette façon, vous ne perdez aucune personnalisation que vous avez déjà appliquée.

le MatérielFox-master le dossier que vous avez téléchargé contient un chrome dossier avec un userChrome.css fichier dedans. Ouvrez ça userChrome.css fichier dans un éditeur de texte comme le Bloc-notes, copiez tout ce qu'il contient et fermez le fichier.

Ensuite, ouvrez le vôtre userChrome.css fichier (dans le chrome dossier dans votre dossier de profil) dans un éditeur de texte. Collez le texte que vous avez copié à la fin de votre userChrome.css fichier et enregistrez et fermez le fichier.

Copier le contenu du fichier userChrome.css de MaterialFox

Copiez et collez le dossier Chrome téléchargé

Si vous n’avez pas déjà chrome dossier dans votre dossier de profil, ouvrez une nouvelle fenêtre Explorateur de fichiers, puis ouvrez le MatérielFox-master dossier que vous avez extrait.

Copiez le chrome dossier dans le MatérielFox-master dossier.

Copier le dossier chrome dans le dossier MaterialFox

Revenez à la fenêtre Explorateur de fichiers avec votre dossier de profil ouvert.

Collez le chrome dossier que vous avez copié à partir du MatérielFox-master dossier dans votre dossier de profil.

Collez le dossier chrome dans votre profil Firefox

Corriger les onglets noirs et les icônes étranges

Ouvrez Firefox pour voir le résultat des nouveaux paramètres de l'interface utilisateur de Material Design.

Vous remarquerez que les onglets sont noirs et que les icônes semblent étranges.

Onglets Black Material Design dans Firefox

Nous allons résoudre ce problème à l'aide d'un paramètre de configuration Firefox.

Type: à propos de: config dans la barre d'adresse de Firefox et appuyez sur Entrer. Vous verrez un message d'avertissement.

Cliquez sur J'accepte le risque! continuer.

Aller à about: config dans Firefox

Type: svg.context dans le Chercher boîte. La préférence suivante s'affiche:

svg.context-properties.content.enabled

Cette préférence est définie sur faux par défaut, ce qui signifie qu'il est désactivé.

Pour activer la fonctionnalité, double-cliquez dessus pour changer sa valeur en vrai. Vous pouvez également cliquer avec le bouton droit sur la préférence et sélectionner Basculer.

Double-cliquez sur la préférence svg.context

Passez maintenant à n'importe quel autre onglet ou redémarrez Firefox. Les onglets noirs et les icônes étranges sont corrigés.

Onglets noirs dans Firefox corrigés

Afficher la couleur d'accentuation de Windows 10 sur la barre de titre de Firefox

Dans Windows 10, il y a encore une chose à changer, si vous voulez que la barre de titre et les onglets inactifs de Firefox ne soient pas noirs.

Cliquez sur Paramètres dans le menu Démarrer et accédez à Personnalisation> Couleurs.

Vérifier la Barres de titre et bordures de fenêtre boîte sous Afficher la couleur d'accent sur les surfaces suivantes.

Afficher les options de couleur d'accent dans Windows 10

Profitez de l'interface utilisateur de Material Design dans Firefox

Maintenant, les onglets ont de beaux coins arrondis et les icônes ont le look Material Design. Et la barre de titre et les onglets inactifs ont la couleur d'accent que vous avez choisie dans les paramètres de Windows 10.

Accentuation de la couleur sur la barre de titre de Firefox

Désinstaller l'interface utilisateur de Material Design de Firefox

Si vous décidez de revenir aux coins pointus des onglets et des icônes d'origine de Firefox, c'est facile. Effectuez l'une des actions suivantes:

  • Si vous avez copié le chrome dossier du MatérielFox-master dossier dans votre dossier de profil, supprimez ce dossier chrome.
  • Si vous avez copié le texte du userChrome.css fichier dans le MatérielFox-master dossier et collé dans le vôtre userChrome.css fichier, ouvrez votre userChrome.css fichier et supprimez le texte que vous y avez collé.
0

Articles similaires

laissez un commentaire