Modifica il colore del nome utente CSS per interi gruppi personalizzati, funziona a volte e poi no?

Sviluppatore
1

Non sono sicuro di cosa lo stia causando esattamente, ma qualsiasi codice CSS che uso per fare questo sembra attivarsi e disattivarsi in modo casuale, non so se sia dovuto a un aggiornamento, a qualche impostazione, ecc…

Quello che uso da più tempo è

.topic-post .Veeps a {
color: #66FF00;
}

Con “Veeps” che è il mio Gruppo Personalizzato. Funzionava fino a ieri o l’altro ieri, ma ho notato che oggi tutti i colori tranne quelli collegati a nomi utente specifici sono tornati al default, su ogni tema. Ho creato un nuovo tema e ho eliminato tutte le modifiche per provare, letteralmente nessuno funziona. Funziona perfettamente con gruppi predefiniti come “admin”, “staff”, moderatore, ma non riesco a farne funzionare nessuno per i gruppi personalizzati. Mi sono assicurato che sia impostato su Gruppo Primario, l’ho reso l’unico gruppo di cui facevano parte, ho provato su diversi gruppi personalizzati (“Owner”), niente. Ora, se lo applico a nomi utente specifici funziona bene, ma è noioso dover creare 100 voci separate per gli individui, che non si aggiornano se il loro gruppo cambia.

span.username.staff a {
      color: #00A9DB;
}

Funziona, ma anche non per i Gruppi Personalizzati. So che era possibile far funzionare i Gruppi Personalizzati perché per anni ha funzionato per molti (tranne quando non funziona). C’è qualche CSS migliore da usare, o qualche impostazione che sto inavvertitamente modificando?

Ho installato GitHub - discourse/discourse-groups-css-classes-in-body e ora ho ottenuto

div.topic-post.group-Veeps div.names span.username a {
  color: #8A2BE2;
}

per funzionare come volevo, ma non installo questo (né uso questo CSS) da un paio d’anni, quindi non mi aiuta a capire cosa esattamente ha smesso di funzionare/cosa correggere, sto solo colpendo il chiodo con il trapano.

2 Mi Piace
2

Ciao,

Ieri c’è stato un cambiamento DEV: add title class name, prefix username class (#19482) · discourse/discourse@b1e0836 · GitHub quindi ora devi aggiungere il prefisso group-- al nome del gruppo in css. Ad esempio: .group--Veeps.

5 Mi Piace
3

Sì, scusa per l’inconveniente, ma il modo precedente in cui aggiungevamo il nome della classe del gruppo era un po’ soggetto a errori… significava che qualsiasi nome di gruppo che per caso corrispondesse a un nome di classe nel nostro CSS avrebbe causato problemi di layout.

Ad esempio, un gruppo chiamato “hidden” avrebbe aggiunto la classe .hidden, che avrebbe nascosto i nomi utente. L’aggiunta del prefisso group-- evita questo problema e non dovrebbe essere necessario modificarlo di nuovo in futuro. Quindi dovresti solo aggiornare .Veeps a .group--veeps

6 Mi Piace
4

Grazie per avermelo fatto sapere, mi sento leggermente meno stupido per aver in qualche modo rotto qualcosa cercando di sistemare qualcos’altro, come spesso accade! Ho provato alcuni casi diversi e funzionano tutti bene e sono riuscito a capirlo con queste informazioni.

Richiede l’uso di GitHub - discourse/discourse-groups-css-classes-in-body per utilizzare ancora i Gruppi Primari personalizzati in questo modo di cui stavo parlando, o è non necessario? Forse ho frainteso lo scopo di quel plugin in primo luogo e non è mai stato necessario per quello che stavo facendo; l’ho appena rimosso dal mio tema di test per vedere se i codici personalizzati dei gruppi primari si attivavano ancora, e lo fanno, quindi sembra che non sia necessario… ma preferirei essere sicuro prima di disattivarlo e trovare qualcosa di inaspettato in futuro.

2 Mi Piace
5

I gruppi primari sono presenti senza di esso, quindi possono essere presi di mira con CSS. Con il componente del tema installato, puoi anche prendere di mira gruppi non primari. :+1:

2 Mi Piace
6

Non ho capito quale codice usare, forse la traduzione è fuori contesto

quindi invece di usare questo

div.topic-post.group-Veeps div.names span.username a {
  color: #8A2BE2;
}

uso questo

div.topic-post.group-- Veeps div.names span.username a {
  color: #8A2BE2;
}

Non capisco cosa dovrebbe essere messo nel codice? è solo il --

@Kartoon @Don @awesomerobot

7

Ciao,

Dovrebbe funzionare così: :arrow_down_small:

.names span {
  &.group--GroupName a {
    color: red;
  }
}

Ma ho creato un componente a tema per questo adesso. :slightly_smiling_face:

Qui puoi semplicemente impostarlo.

nomegruppo;colore

Screenshot 2023-01-14 at 21.07.53
Screenshot 2023-01-14 at 21.07.53767×399 31.1 KB

7 Mi Piace
8

Probabilmente non sono la persona migliore da chiedere perché riesco a far funzionare le cose ma non necessariamente a spiegarne il motivo. Ma quello che sto usando attualmente e che funziona bene

.topic-post.group-Veeps div.names span.username a {
   color: #66FF00;
 }

Ovviamente sostituisci “Veeps” con qualsiasi gruppo di utenti tu abbia, il mio si chiama così.

.names span {
  &.group--Veeps a {
    color: red;
  }
}

Come menzionato sopra funziona anche, l’ho solo scambiato con quello che avevo. Probabilmente installerò il plugin che ha appena pubblicato per comodità in ogni caso.

1 Mi Piace
9

Ho lo stesso problema, non so cosa c’è che non va, impressionante che anche usando il tema competente o il codice, perché i nomi dei membri non cambiano colore, ho persino usato il cogido e il tema del componente in un tema grezzo senza alcun css o modifiche e non cambia nulla riguardo ai colori del titolo.

Ho appena notato qualcosa di intrigante, se metto qualcuno nel gruppo come proprietario, il codice di modifica funziona e i colori dei nomi dei membri che ho impostato come proprietario cambiano, ma i membri che non sono proprietari non cambiano.

@Kartoon @Don @xebiyen