Cambia i colori predefiniti dei badge (bronzo, argento, oro)

Sviluppatore
1

È possibile cambiare i colori delle medaglie da oro, argento e bronzo a 3 colori che si abbinino meglio ai colori del nostro tema? Vorremmo cambiarli per abbinarli un po’ meglio.

2

Non sono un mago del CSS, ma questa sarebbe la mia soluzione… Cambia semplicemente i colori in quelli che preferisci per abbinarli meglio ai colori del tuo tema qui sotto. Ti consiglio inoltre di leggere questo argomento, mi è stato molto utile in passato perché mi ha aiutato a imparare a fare cose fantastiche con il mio sito.

Bronzo

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

Argento

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

Oro

.badge-card .badge-contents .badge-icon.badge-type-gold .fa {
    color: #e7c300 !important;
}
6 Mi Piace
4

Leggenda. Grazie mille!

5

Usi solo inspect per trovare le cose? Li ho cambiati tutti, ma ora sto cercando di lavorare su quelli che appaiono sulla scheda utente? inspect di Chrome è il modo per cercare di capire come si chiamano le cose?

6

Sì, basta ispezionare gli elementi per trovare la classe di ciò che devi personalizzare. Trovo utile anche la guida di stile.

3 Mi Piace
7

Fantastico! Quella guida di stile è fondamentale. Mi ha letteralmente aiutato a sistemare tutto (lo styling prima del lancio). Sai se si può accedere alla sezione admin da lì? Non sono riuscito a trovarla. L’unica cosa che resta da sistemare è il colore degli utenti per livello di fiducia. Ho provato a ispezionare ma niente avrebbe cambiato questo piccolo contenitore color bronzo. Questo è il compito finale e sono determinato a portarlo a termine oggi haha

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

8

che si trova nella dashboard dell’amministratore, quindi gli utenti normali non lo vedranno comunque. ma ecco qui:

TL 1:

.user-metrics .table-cell.user-basic {
    background: [inserire qui il codice colore o la variabile];
}

TL 2:

.user-metrics .table-cell.user-member {
    background: [inserire qui il codice colore o la variabile];
}

TL 3:

.user-metrics .table-cell.user-regular {
    background: [inserire qui il codice colore o la variabile];
}

TL 4:

.user-metrics .table-cell.user-leader {
    background: [inserire qui il codice colore o la variabile];
}
4 Mi Piace
9

Fantastico. Il mio DOC ti ringrazia moltissimo!!! :joy:

1 Mi Piace