Changer les couleurs par défaut des badges (Bronze, Argent, Or)

Dev
1

Possible de changer les couleurs des badges de l’or, de l’argent et du bronze en 3 couleurs qui correspondraient mieux à nos couleurs thématiques ? J’aimerais les changer pour qu’elles correspondent un peu mieux.

2

Je ne suis pas un gourou du CSS, mais voici ma solution… Changez simplement les couleurs pour qu’elles correspondent mieux aux couleurs de votre thème ci-dessous. Je vous recommande également de lire ce sujet, il m’a beaucoup aidé par le passé car il m’a appris à faire des choses cool avec mon site.

Bronze

.badge-card .badge-contents .badge-icon.badge-type-bronze .fa {
    color: #cd7f32 !important;
}

Argent

.badge-card .badge-contents .badge-icon.badge-type-silver .fa {
    color: silver !important;
}

Or

.badge-card .badge-contents .badge-icon.badge-type-gold .fa {
    color: #e7c300 !important;
}
6 « J'aime »
4

Légende. Merci beaucoup !

5

Utilisez-vous simplement l’inspecteur pour trouver des choses ? J’ai tout changé, mais j’essaie maintenant de travailler sur ceux qui s’affichent sur la carte utilisateur. L’inspecteur Chrome est-il le moyen d’essayer de trouver les noms des choses ?

6

Oui, il suffit d’inspecter les éléments pour trouver la classe de ce que vous devez personnaliser. Je trouve également le guide de style utile.

3 « J'aime »
7

Incroyable ! Ce guide de style est essentiel. Il m’a littéralement aidé à tout ajuster (style avant le lancement). Savez-vous si vous pouvez accéder à la section d’administration à partir de là ? Je ne l’ai pas trouvée. La seule chose qui reste à régler est la couleur des utilisateurs par niveau de confiance. J’ai essayé d’inspecter mais rien n’a changé ce petit conteneur de couleur bronze. C’est la dernière tâche et je suis déterminé à la terminer aujourd’hui haha

Screenshot 2023-07-30 at 8.02.18 AM
Screenshot 2023-07-30 at 8.02.18 AM560×222 4.31 KB

8

c’est dans le tableau de bord administrateur donc les utilisateurs réguliers ne le verront pas de toute façon. mais voici :

TL 1 :

.user-metrics .table-cell.user-basic {
    background: [insérer le code couleur ou la variable ici];
}

TL 2 :

.user-metrics .table-cell.user-member {
    background: [insérer le code couleur ou la variable ici];
}

TL 3 :

.user-metrics .table-cell.user-regular {
    background: [insérer le code couleur ou la variable ici];
}

TL 4 :

.user-metrics .table-cell.user-leader {
    background: [insérer le code couleur ou la variable ici];
}
4 « J'aime »
9

Incroyable. Mon TOC vous remercie beaucoup !!! :joy:

1 « J'aime »