FAQ de Thunderbird - Le fichier userChrome.css
24.09.18-Dernières mise à jour : 17.10.23 (TB115)
A savoir : Certains codes peuvent ne pas fonctionner suivant la version de
Thunderbird utilisée !
Mes essais on été fait avec Windows, en effet sous linux par exemple certains codes sont inopérants.
Certains codes fonctionnent aussi sur SeaMonkey.
Et il est conseillé d'utiliser le thème par défaut pour les essais.
11.11.11 - Dernières mise à jour : 02.10.23 (TB115)
Mettre la barre de menu Fichier / Édition / Affichage... tout en haut
Capture 1 - Barre de menu par défaut
code du fichier userChrome.css :
/* Changer de place la barre de menu Fichier... (ok avec TB115) */
#toolbar-menubar {
order: -1 !important;
}
Capture 2 - Résultat (TB115)
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
Dernière mise à jour : 17.10.23
Changer la couleur de l'AR-Plan des 3 barres supérieures
Changer la couleur de l'AR-Plan des 4 boutons (Option/Mini/Maxi/Fermer)
code du fichier userChrome.css :
/* Changer l'AR-Plan des 2 barres (menus + onglets) (ok avec TB115) */
menubar, toolbar {
background: #EFF8FB !important;
}
/* Pour l'AR-Plan des BARRE DES ICONES Relever Écrire Étiquette...(ok TB115) */
#unifiedToolbar {
background: #EFF8FB !important;
}
/* Pour l'AR-Plan des SOUS-MENUS (ok avec TB115) */
.scrollbox-clip {
background: #EFF8FB !important;
}
Capture 1 - Résultat pour les 3 barres
Capture 2 - Résultat pour les sous-menus (pas tous!)
05.11.16-Dernière mise à jour : 02.10.23 (TB115)
Modifier la couleur du texte + Arrière-plan des boutons Relever, Écrire, Étiquette...
05.11.16-Dernière mise à jour : 02.10.23 (TB115)
Changer la couleur de l'AR-Plan des 4 boutons (Option/Mini/Maxi/Fermer)
/* Changer l'AR-Plan du bouton options ("burger") (ok avec TB115) */
.button-appmenu {
color: black !important; font-weight: bold !important;
background-color: #E0ECF8 ! important;
}
/* au survol de la souris */
.button-appmenu:hover {
background-color: #A9D0F5 ! important;
}
/* Changer l'AR-Plan du bouton MINI (ok avec TB115) */
.titlebar-min {
color: black !important; font-weight: bold !important;
background: #CEE3F6 !important;
}
/* au survol de la souris */
.titlebar-min:hover {
color: Yellow !important; font-weight: bold !important;
background-color: #819FF7 ! important;
}
/* Changer l'AR-Plan du bouton MAXI (ok avec TB115) */
.titlebar-buttonbox-container {
color: black !important; font-weight: bold !important;
background-color: #A9D0F5 !important;
}
/* Changer l'AR-Plan du bouton FERMER (ok avec TB115) */
.titlebar-close {
color: RED !important; font-weight: bold !important;
background: #819FF7 !important;
}
/* au survol de la souris */
..titlebar-close:hover {
color: white !important; font-weight: bold !important;
background-color: #RED ! important;
}
Capture 1 & 2 - Résultats
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
Dernières mise à jour: 09.02.19
Masquer la CROIX de fermeture
Pourquoi masquer cette croix ? R: Pour ne pas fermer Thunderbird par erreur .
code du fichier userChrome.css :
/*masquer la CROIX de fermeture ok TB60 12.08.18 */
#titlebar-close {
display: none !important;
}
/* Pour fermer il faudra passer par : » Fichier » Quitter */
Capture 1-AvantCapture 2-Après
Pour fermer TB il faudra utiliser » Fichier » Quitter
» ou » Menu (hamburger) » Quitter
» ou ALT + F4
Dernière mise à jour : 17.10.23(TB115)
Couleurs des onglets + texte + arrondir
code du fichier userChrome.css :
/* Couleurs des onglets + texte + arrondir (ok avec TB115) */
.tab-background {
border-radius: 16px 16px 10px 10px !important;
background-color: #B0E0E6 ! important;
}
/* onglet actif */
.tabmail-tab[selected] .tab-background {
background-color: #E0ECF8 ! important;
}
/* au survol de l'onglet */
.tabmail-tab:hover .tab-background {
background-color: #81BEF7 ! important;
}
/* on supprime le liseret bleu */
.tab-line {
display: none;
}
Capture 1 - Résultat
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
Dernière mise à jour : 17.10.23 (TB115)
Couleurs du texte Agenda/Carnet d'adresses & Gestionnaire de modules...
code du fichier userChrome.css :
/* Couleur du texte "Agenda" (ok avec TB115) */
[label="Agenda"] {
color: green !important; font-weight: bold !important;
}
/* Couleur du texte "Carnet d'adresses" */
[label="Carnet d'adresses"] {
{ color: Red !important; font-weight: bold !important;
}
/* Couleurs du texte "Gestionnaire de modules..." */
[label="Gestionnaire de modules complémentaires"] {
color: Blue !important; font-weight: bold !important;
}
Capture 1 - Résultat
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
31.01.14-Dernières mise à jour : 09.10.23 (TB115)
Changer la couleur de l'Arrière-plan du panneau des dossiers
code du fichier userChrome.css :
/* changer la couleur de l'AP du panneau des dossiers-ok TB115 */
#folderTree {
background-color: #EDF7F2 !important;
}
Capture 1-TB115 (couleur pour ce test)
Attention: Le résultat peut-être différent suivant le
thème choisi.
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
Dernières mise à jour : 09.10.23 (TB115)
Changer la couleur des "bulles" (Non lu) dans le panneau des dossiers
Couleur des "bulles" par défaut
code du fichier userChrome.css :
/* changer la couleur de l'AP du panneau des dossiers-ok TB115 */
:root {
--folderpane-unread-count-background: orchid !important;
--folderpane-unread-new-count-background: limegreen !important;
}
Capture 1-TB115
source forums.mozillazine.org
Attention: Le résultat peut-être différent suivant le
thème choisi.
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
Créé 5.10.23-Dernières mise à jour : 05.10.23 (TB115)
Diminuer la densité de la liste des comptes de TB115
Ce qui augmentera le nombre de lignes affichées
code du fichier userChrome.css :
/* Remettre la densité de TB102 dans la liste des comptes - ok TB115 */
:root {
--list-item-min-height: 20px !important;
--list-item-buttons-size: 20px !important;
}
Capture 1-AvantCapture 2-Après
Pour réduire la densité dans le volet des messages (pas testé)
/* Reduire la densité dans le volet des messages - (pas testé) */
div#threadPane table-vue arborescente.tree-table tbody tr {
hauteur : 20px !important;
}
source www.reddit.com
21.08.18-Dernières mise à jour: 16.10.23 (TB115)
Changer la couleur du nom des dossiers
(rouge = nouveau message /
bleu = non lu)
code du fichier userChrome.css :
/* NOM des dossiers (bleu) contenant des: Non lus ok TB115 */
.unread > .container > .name {
color: BLUE !important; font-weight: bold !important;
}
/*Noms dossiers (rouge) avec des nouveaux messages ok TB115 */
.new-messages > .container > .name {
ncolor: red !important; font-weight: bold !important;
}
Capture 1 - vue: Dossiers unifiés (TB115)
66 Non lus - 7 nouveaux messages dans le compte J2m-GM & 3 dans ADVBS-RESER.
Capture 2 - avec SeaMonkey 2.49.3
source forums.mozillazine.org
Pour le code hexadécimal des couleurs voir » ici « ,
ou » ici « .
Dernière mise à jour : 20.10.23 (TB115)
Modifier la police et couleur Arrière-plan des boutons du fitre rapide
code du fichier userChrome.css :
/* Changer Police/AP des boutons du fitre rapide - ok TB115 */
#qfb-unread, #qfb-starred { color:blueviolet !important;
border-right: solid 2px #F9F9F9 !important;
background-color: #819FF7 !important; font-weight: bold !important;
}
#qfb-unread:hover , #qfb-starred:hover { color:red !important;
background-color: #E0ECF8 !important;
}
#qfb-inaddrbook, #qfb-tags { color:blueviolet !important;
border-right: solid 2px #F9F9F9 !important;
background-color: #819FF7 !important; font-weight: bold !important;
}
#qfb-inaddrbook:hover, #qfb-tags:hover { color:red !important;
border-right: solid 2px #F9F9F9 !important;
background-color: #E0ECF8 !important;
}
#qfb-attachment { color:blueviolet !important;
background-color: #819FF7 !important;
}
#qfb-attachment:hover { color:red !important;
background-color: #E0ECF8 !important;
}
Capture 1 - ok TB115
Capture 2 - résultat au survol du bouton
11.11.11 - Dernières mise à jour : 02.10.23 (TB115)
Mettre une couleur en arrière-plan des entêtes.
code du fichier userChrome.css :
/*Couleur (bleu lavande) panneau des entêtes des messages-ok TB1115 */
#msgHeaderView {
background-color: #E6E6FA !important;
}
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
04.12.15-Dernière mise à jour : 02.10.23 (TB115)
Modifier la police et couleur Arrière-plan de Sujet (message reçu)
code du fichier userChrome.css :
/* Changer Police/AP de la ligne Sujet des messages recus - ok TB115 */
#expandedsubjectBox {
font-size: 3.2mm !important; /* modifie la taille */
font-family: Arial !important;
font-weight: bold !important; /* met en gras */
color: yellow !important; background-color: black !important;
}
Capture 1 - ok TB115 avec thème par défaut
04.06.21-Dernière mise à jour : 02.10.23 (TB115)
Modifier la couleur du texte de : Copie cachée à
Capture 1 - AVANT
code du fichier userChrome.css :
/*Modifier la couleur du texte de : Copie cachée à - ok TB115 */
#expandedbccLabel {
color: yellow !important;
}
Capture 2 - Résultat TB115
Dernière mise à jour : 23.10.23 (TB115)
Modifier la couleur des textes de : Détacher / Supprimer
code du fichier userChrome.css :
/*Modifier la couleur du texte de : Détacher / Tout détacher - ok TB115 */
#button-detachAllAttachments, [label="Détacher."] {
color: blue !important; font-weight: bold !important;
}
/*Modifier la couleur du texte de : Supprimer / Tout Supprimer - ok TB115 */
#button-deleteAllAttachments, [label="Supprimer"] {
color: red !important; font-weight: bold !important;
}
Capture 1&2 - Résultat TB115
27.11.18-Dernières mise à jour :04.10.23 (NON DEPUIS TB115)
1.Changer les icônes de mes dossiers (avec userChrome.css).
NE FONCTIONNE PLUS DEPUIS TB115. Le langage XUL étant progessivement abandonné.
2.Changer les icônes de mes dossiers avec QuickFolders.
NON AVEC TB115
23.07.14-Dernières mise à jour : 29.08.18
Changer la taille de la "police" des caractères.
code du fichier userChrome.css :
/* changer la taille de la "police" de caractères (ok TB60) */
.tree-rows {
font-size: 15px !important;
}
Dernières mise à jour: 30.01.23
Masquer le bouton (+ label) Archiver
24.02.13-Dernières mise à jour: 12.09.18
Masquer les infos des entêtes de message
code du fichier userChrome.css :
/* masquer le panneau des entêtes de message (ok TB60 08.08.18) */
#msgHeaderView {
display : none;
}
Capture 1 - Avant
Capture 2 -Après
Vous remarquerez que les icônes: Répondre/Transférer etc..
ont disparues !
Il faudra les installer dans la barre supérieure comme dans TB2.
N'oubliez pas ! Pour revenir en arrière il suffit de mettre les lignes de code entre
/* et */ .
01.06.16-Dernières mise à jour : 08.08.18
Masquer le menu: Outils et/ou ses sous-menus.
code du fichier userChrome.css :
/* masquer le menu Outils (ok TB45 01.06.16) */
#tasksMenu {
display: none !important;
}
/* masquer le sous-menu Modules complémentaires - (ok TB38 05.12.15) */
#addonsManager {
display : none !important ;
}
/* masquer le sous-menu Importer... (ok TB60 08.08.18) */
#menu_import {
display: none !important;
}
/* masquer le sous-menu Console d'erreurs (ok TB38 05.12.15) */
#javaScriptConsole {
display : none !important ;
}
/* masquer le sous-menu Paramètres du compte (ok TB60 08.08.18) */
#menu_accountmgr {
display: none !important;
}
/* masquer le sous-menu Options (ok TB60 08.08.18) */
#menu_preferences {
display: none !important;
}
Masquer le menu: Gérer les filtres de messages
code du fichier userChrome.css :
/*masquer: Gérer les Filtres des messages de :
Paramètres du compte */
#CreateFilters {
display: none !important;
}
/*cacher le menu: Filtres de messages de:
Outils - ok TB31 22.05.15 */
#filtersCmd {
display : none !important ;
}
Masquer le menu: Paramètres du compte et Créer un
nouveau compte (ok TB38).
code du fichier userChrome.css :
/* masquer: Paramètres du compte de : Outils
(ok TB2 25.11.2009) */
#menu_accountmgr {
display: none !important;
}
/* masquer: Voir les paramètres du compte ET Créer un nouveau compte */
#AccountSettings, #CreateAccount {
display: none !important;
}
/* cacher: Propriétés (obtenu par
-►Clic droit sur un compte) */
#folderPaneContext-properties {
display: none !important;
}
Masquer le menu: Fichier (en entier).
code du fichier userChrome.css :
/* cacher TOUT le menu : Fichier (ok TB2 07.11.09 - NON TB31) */
#menu_File {
display: none !important;
}
Masquer le menu: Édition (en entier).
code du fichier userChrome.css :
/* cacher TOUT le menu : Édition (ok TB2 07.11.09 - NON TB31) */
#menu_Edit {
display: none !important;
}
Masquer le menu: Affichage (en entier)
code du fichier userChrome.css :
/* cacher TOUT le menu : Affichage (ok TB17 24.08.13 - NON TB31) */
#menu_View {
display: none !important;
}
Résultat (TB17) plus de menu: Affichage
Masquer les 3 menus: Fichier, Édition et Affichage.
code du fichier userChrome.css :
/* masquer les 3 menus : Fichier, Édition, Affichage (ok TB2 11.09-NON TB31) */
#menu_File, #menu_Edit, #menu_View {
display: none !important;
}
Masquer le menu: Propriétés, de : clic droit
code du fichier userChrome.css :
/* masquer Propriétés (obtenu par
► Clic droit sur un compte)(ok TB2 07.11.09) */
#folderPaneContext-properties {
display: none !important;
}
Masquer les menus: Paramètres du compte / Voir les paramètres du compte /
Créer un nouveau compte.
code du fichier userChrome.css :
/* masquer: Paramètres du compte de : Outils
(ok TB2 25.11.09-NON TB31 */
#menu_accountmgr {
display: none !important;
}
/* masquer: Voir les paramètres du compte-NON TB31 */
#AccountSettings {
display: none !important;
}
/* masquer: Créer un nouveau compte-NON TB31 */
#CreateAccount {
display: none !important;
}
/* masquer: Propriétés (►Clic
droit sur compte )-NON TB31 */
#folderPaneContext-properties {
display: none !important;
}
31.01.14-Dernières mise à jour:02.10.23 (TB115)
Mettre une couleur en arrière-plan du volet(liste) des messages
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
Dernières mise à jour : 02.10.23
Mettre en couleur les lignes marquées avec une étiquette.
NE FONCTIONNE PLUS DEPUIS TB115. Le langage XUL étant progessivement abandonné.
Pour le code hexadécimal des couleurs
voir » ici « , ou » ici « .
23.07.14-Dernières mise à jour: 02.10.23 (TB115)
Mettre en couleur la ligne "Sujet" des messages "Non lus"
code du fichier userChrome.css :
/* Coloriser (DarkMagenta) les messages non lus */
#threadTree tbody [data-properties~="unread"] (unread)
color: #8B008B !important; font-weight: b old !important; }
Capture 1 - Résultat dans TB115
Pour le code hexadécimal des couleurs
voir » ici « , ou
» ici « .
05.07.13-Dernières mise à jour: 24.09.18
Mettre en couleur Un nom de dossier de son choix
NB : Depuis Thunderbird 24 l'extension MailTweak ne fonctionne plus. Ce tuto est obsolète
05.07.13-Dernières mise à jour : 24.09.18
Mettre en couleur tous les noms de dossier d'un compte de son choix
NB : Depuis Thunderbird 24 l'extension MailTweak ne fonctionne plus. Ce tuto est obsolète
20.06.14 - Dernières mise à jour : 10.10.23 (TB115)
Modifier les couleurs (texte et AR-Plan) des barres de notification:
» Thunderbird pense que ce message est frauduleux.
» Ceci est un brouillon.
» Envoyer l'accusé de réception
» Ignorer la demande
» xxx a demandé à recevoir une notification.....
Pour le code hexadécimal des couleurs
voir » ici « , ou
» ici « .
Créé -Dernières mise à jour : 17.10.23 (TB115)
Modifier l'AR-P des boutons en Rédaction
code du fichier userChrome.css :
/* Bouton Envoyer*/
#button-send {
color:yellow !important; font-weight: bold !important;
background-color: #819FF7 !important;
}
/* au survol de la souris */
#button-send:hover
{ color:black !important; background-color: #B0E0E6 !important;
}
/* Bouton Chiffrer*/
#button-encryption {
color:black !important; font-weight: bold !important;
background-color: #819FF7 !important;
}
/* Bouton Orthographe*/
#spellingButton {
color:yellow !important; background-color: #819FF7 !important;
}
/* au survol de la souris */
#spellingButton:hover {
color:black !important; background-color: #B0E0E6 !important;
}
/* Bouton Enregistrer*/
#button-save {
color:yellow !important; background-color: #819FF7 !important;
}
/* au survol de la souris */
#button-save:hover {
color:black !important; background-color: #B0E0E6 !important;
}
/* Bouton Joindre*/
#button-attach {
color:yellow !important; background-color: #819FF7 !important;
}
/* au survol de la souris */
#button-attach:hover {
color:black !important; background-color: #B0E0E6 !important;
}
Résultat
Pour le code hexadécimal des couleurs
voir » ici « , ou
» ici « .
23.10.14-Dernières mise à jour : 12.08.20
Modifier les couleurs des evénements de Lightning suivant la catégorie
code du fichier userChrome.css :
/* Modifier la couleur des catégories Eveline/Anniv. et J2m ok TB68 */
.calendar-event-box-container [categories="eveline"]
{ color: blue !important; background-color: #FFBFFF !important;
}
.calendar-event-box-container [categories="anniversaire"]
{ color: white !important; background-color: #FF4000 !important;
}
.calendar-event-box-container [categories="j2m"]
{ color: black !important; background-color: #00FF80 !important;
}
/* mettre une couleur pour les événements sans catégorie ok TB68 */
.calendar-event-box-container:not ([categories])
{ background-color: #E000E0 !important;
}
Résultat dans Lightning
Avant Après
Pour le code hexadécimal des couleurs
voir » ici « , ou
» ici « .
L' extension Calendar Tweaks permet aussi de modifier
les couleurs.
Créé 02.01.11-Dernières mise à jour : 12.07.21
Modifier l'arrière-plan des jours (vue mois/multisemaine)
code du fichier userChrome.css :
/* Jours ouvrables du MOIS en cours (vue MOIS) - NON TB102*/
.calendar-month-day-box-current-month
{ background-color: yellow !important;
}
/* WEEK-END - couleur rouille (vue MOIS) - NON TB102*/
.calendar-month-day-box-day-off
{ background-color: #FF4000 !important;
}
Résultat-j'ai mis volontairement 2 couleurs très voyantes
Pour le code hexadécimal des couleurs
voir » ici « , ou
» ici « .
Créé 02.01.11-Dernières mise à jour : 04.10.23
Modifier les couleurs dans le panneau des evénements de Lightning.
code du fichier userChrome.css :
/* TEXTE et couleur de fond de l'ENTETE du Panneau aujourd'hui - ok TB115 */
#mini-day-box {
color: blue !important; background-color: #DFD2C0 !important;
}
/* Modifier la date du jour (en chiffre : 9) ok TB115 */
#dateContainer {
color: WHITE !important; background-color: red !important; }
}
Résultat dans Lightning
Capture 1
Pour le code hexadécimal des couleurs
voir » ici « , ou
» ici « .
Créé 02.01.11-Dernières mise à jour : 09.02.23
Modifier les couleurs dans le panneau des evénements de Lightning.
code du fichier userChrome.css :
/* Aujourd'hui - couleur de fond en Jaune/texte rouge ok TB68 - NON TB102 */
#today-header {
color: red !important; background-color: yellow !important;
}
/* Demain - couleur de fond en vert/texte jaune ok TB68 - NON TB102 */
#tomorrow-header {
color: yellow !important; background-color: green !important;
}
Malgré toutes ces informations,
je n'ai pas trouvé de réponse ou puis-je
poser ma question ?
R-
►sur le
forum de Geckozone
Des bénévoles vous aideront (et un petit bonjour en début de message sera le bienvenu
), mais avant faites une recherche sur
le forum au cas ou votre question aurait déjà été posée(et peut-être solutionnée!)