Stili di tag colorati

[manuel (Manuel Kostka)]

|||
|-|-|-|
| | Riepilogo | Assegna tag a un set di stili di colore predefiniti |
| |Repository| Manuel Kostka / Discourse / Helpers / Tag Styles · GitLab |
| |Guida all’installazione|Come installare un tema o un componente tema|
| |Nuovo ai temi di Discourse?| Guida per principianti all’uso dei temi di Discourse

Impostazioni del tema

Puoi selezionare i tag da un elenco a discesa per ogni colore.

Impostazioni del sito

Il componente è pensato per funzionare con lo stile di tag box. Per gli stili simple o bullet dovresti aggiungere alcune dichiarazioni personalizzate per regolare i tag.

Personalizzazione dei colori

Ho scelto un’interfaccia semplice invece della flessibilità con gli stili. Quindi, se vuoi cambiare i colori predefiniti, dovrai eseguire il fork del componente e modificare le dichiarazioni di stile nel suo file CSS.

[Fma965]

Bel lavoro, questo funziona solo se lo stile del tag è impostato su BOX\n\nrimuovere .box lo fa funzionare su semplice, non sono sicuro se rompe box o meno però\n

[tmn (Tran Nhat)]

Semplice ma funziona perfettamente. Grazie.

[sunjam (james.network)]

• Sarebbe possibile assegnare colori ai gruppi di tag anziché ai singoli tag?
• Sarebbe possibile personalizzare i colori disponibili per seguire i valori esadecimali per daltonici?

[manuel (Manuel Kostka)]

Grazie per i suggerimenti!

Per quanto riguarda il targeting dei gruppi di tag: al momento i tag hanno solo un attributo di dati per il loro nome ed è ciò che il componente prende di mira. Avevo pubblicato una richiesta di funzionalità per aggiungere un altro attributo per il loro gruppo un po’ di tempo fa, puoi mettere un like

Add a data-tag-group attribute for tags

Right now tags have their name stored in the data attribute data-tag-name: [Screenshot from 2022-07-29 15-50-16] Could there also be an attribute data-tag-group? It would make it easy to style and distinguish tags from different groups on the ux. A use-case where I find this especially helpful is on setups that only use tags. Then you likely have some top-level tags and it makes navigation more intuitive when tags from that group stand out with a distinct look. I saw there was a request years…

Per quanto riguarda la personalizzazione dei colori: al momento dovresti fare un fork del componente e codificare altri valori di colore. Se i menu a discesa (per scegliere i tag) diventassero disponibili negli editor popup, immagino che rifattorizzerò il componente con impostazioni più personalizzabili.

[45thj5ej]

MODIFICA: Lasciando perdere, ho semplicemente dimenticato di salvare l’altro file “settings.yml”, lol. Il cervello è fritto.

Ciao. Quando cambio il codice dal colore giallo al viola, ottengo questo errore. Tutto quello che ho fatto è stato semplicemente sostituire ogni menzione di “giallo” con “viola” e regolare il valore del colore esadecimale. Perché?

  $tags-purple: str-to-list(\"#{$purple}\", \"|\");
  @each $tag in $tags-purple {
    .discourse-tag[data-tag-name=\"#{$tag}\"] {
      color: #CCCCCC !important;
      background-color: #ae00d1;
      &:hover {
        color: #CCCCCC;
        background-color: #ae00d1;
      }
    }
  }

La prima riga qui è la riga 8 che l’errore menziona.

[ogulcan1787]

Ciao, grazie per il componente.
Non funziona con GitHub - discourse/discourse-remove-dashes-from-tag-names: Remove dashes (-) from tag names in the Topic List and on the Topic page.

Forse puoi portare un aggiornamento?

Funziona quando c’è un tag a riga singola, ma non funziona quando c’è una doppia riga.

Come tag a riga singola: support
Doppia riga: support-me

[thaidb]

Possiamo selezionare il colore per tutti i tag nel Gruppo Tag?
E non influisce sul mio discourse!

@ogulcan1787

Non funziona con GitHub - discourse/discourse-remove-dashes-from-tag-names: Remove dashes (-) from tag names in the Topic List and on the Topic page.

anche a me

[Av8tion]

Ciao, questo componente non funziona con la mia istanza. Ho aggiunto i tag per essere sicuro dei colori nel menu di amministrazione per il componente, ma sono ancora tutti grigi. Non ho modificato il codice del componente e sto solo cercando di usarlo come fornito. Immagini qui sotto come esempio:

[manuel (Manuel Kostka)]

Mi dispiace, non riesco a riprodurlo. Funziona per me sulla 3.5.

In ogni caso, ho pubblicato un componente aggiornato su un nuovo repository su GitLab. Nessuna modifica funzionale, solo un po’ di pulizia e refactoring. Il vecchio repository di GitHub dovrebbe ancora funzionare, ma se installi da zero, usa il nuovo repository, è anche elencato nell’argomento Riepilogo.

[Av8tion]

Sì, anche la nuova versione del componente che hai linkato non funziona per me… le caselle sono ancora tutte grigie

[manuel (Manuel Kostka)]

Sì, non c’è alcun cambiamento funzionale. Ma il componente funziona su una nuova istanza predefinita. Hai ispezionato gli elementi?

[Av8tion]

Purtroppo non sono un esperto di programmazione… se un componente non funziona plug-and-play sono abbastanza spacciato. Dovrò cercare altre opzioni per far funzionare qualcosa di simile.

[Ahmed26]

impostate tutte le impostazioni correttamente, le etichette sono ancora disattivate

[manuel (Manuel Kostka)]

Grazie per i report, credo di aver trovato il problema.. i tag ora fanno distinzione tra maiuscole e minuscole, ma data-tag-name deve essere analizzato con un valore minuscolo. Quindi non ha applicato stili ai tag maiuscoli.

Fatemi sapere se funziona dopo aver aggiornato il componente @Ahmed26 @Av8tion

[Ahmed26]

funziona molto bene ora grazie

[Av8tion]

Ottimo lavoro e ottima scoperta! Grazie per l’impegno nel far funzionare queste cose per noi!