Controllo visibilità avviso post

:information_source: Riepilogo Personalizza la visibilità e lo stile degli avvisi dei post per tipo ed età
:hammer_and_wrench: Repository GitHub - moin-Jana/post-notice-visibility-control: Customize visibility and style of post notices by type and age
:question: Guida all’installazione Come installare un tema o un componente del tema
:open_book: Nuovo ai temi di Discourse? Guida per principianti all’uso dei temi di Discourse

Installa questo componente del tema

Questo componente ti consente di controllare come ogni tipo di avviso di post (nuovo utente, utente di ritorno e ufficiale) appare nei post nuovi e più vecchi. Puoi scegliere se devono essere evidenziati, visibili o nascosti e impostare colori di evidenziazione personalizzati in modo indipendente per ogni tipo.

Gli screenshot mostrano esempi di come i diversi tipi possono apparire nei post nuovi (a sinistra) e nei post più vecchi (a destra):

Esempio di configurazione 1
"custom_new": "highlighted"
"custom_old": "highlighted"
"custom_highlight_color": "var(--danger-low-mid)"

"new_user_new": "highlighted"
"new_user_old": "visible"
"new_user_highlight_color": "var(--success-low)"

"returning_user_new": "highlighted"
"returning_user_old": "hidden"
"returning_user_highlight_color": "var(--primary-200)"

Esempio di configurazione 2
"custom_new": "highlighted"
"custom_old": "visible"
"custom_highlight_color": "var(--gold)"

"new_user_new": "visible"
"new_user_old": "hidden"
"new_user_highlight_color": "var(--tertiary-low)"

"returning_user_new": "visible"
"returning_user_old": "hidden"
"returning_user_highlight_color": "var(--tertiary-low)"

Per ogni combinazione di tipo di avviso ed età, puoi scegliere se l’avviso deve essere evidenziato, visibile (senza evidenziazione) o nascosto. Se scegli “evidenziato”, puoi facoltativamente definire un colore di sfondo personalizzato.

Consiglio di utilizzare una variabile di colore come var(--quaternary-low). Queste variabili fanno riferimento ai colori della palette attiva, quindi si adattano automaticamente quando un utente passa da una palette all’altra (ad esempio, modalità chiara e scura). Questo le rende un’opzione più flessibile rispetto ai colori codificati. Sebbene la maggior parte delle palette di colori mostri solo alcuni colori di base, Discourse genera sfumature di questi colori che puoi utilizzare. Puoi esplorare molte delle variabili di colore disponibili utilizzando la guida di stile, che puoi abilitare tramite l’impostazione del sito styleguide enabled. In alternativa, puoi ispezionare il tuo sito nel browser: apri gli strumenti per sviluppatori, vai alla scheda Stili e scorri fino in fondo per vedere tutte le variabili di colore disponibili.

Puoi anche usare valori esadecimali come #EE8888, valori RGB come rgb(255, 200, 200) o colori con nome come red.

Se non viene fornito alcun colore, il componente utilizzerà var(--tertiary-low) come fallback. Le impostazioni predefinite del componente replicano il comportamento standard di Discourse, quindi la semplice abilitazione non cambierà nulla finché non lo configurerai.

Il numero di giorni dopo i quali un avviso di post è considerato “vecchio” è definito dall’impostazione del sito old post notice days. Questo si applica a tutti e tre i tipi di avvisi.
:warning: Importante: L’età si basa su quando è stato creato il post, non su quando è stato aggiunto l’avviso.
Puoi impostare temporaneamente il valore su 0 per visualizzare facilmente come appariranno gli avvisi nel loro stato “vecchio”.

12 Mi Piace

I vecchi avvisi dei post non vengono più visualizzati nell’ultima versione di Discourse, il che significa che non possono essere stilizzati tramite CSS. Di conseguenza, tutte le impostazioni _old non hanno più alcun effetto.

Con gli ultimi aggiornamenti di Discourse, la classe old, che il componente utilizzava per applicare stili diversi a notifiche nuove e vecchie, è stata rimossa. Le notifiche post per utenti nuovi e di ritorno verranno ora rimosse automaticamente dopo l’impostazione giorni vecchie notifiche post, mentre le notifiche ufficiali rimangono permanentemente visibili ed evidenziate.

Di conseguenza, questo componente è diventato in gran parte obsoleto. Le uniche opzioni di personalizzazione rimanenti sono relative alle impostazioni generali del colore per le notifiche post. Queste possono essere facilmente regolate tramite CSS, come mostrato di seguito:

.post-notice.custom {
    background-color: var(--danger-low-mid);
}
.post-notice.new-user {
    background-color: var(--success-low);
}
.post-notice.returning-user {
    background-color: var(--primary-200);
}

Se desideri rimuovere l’evidenziazione dello sfondo per un tipo specifico di notifica, utilizza semplicemente background-color: unset;

2 Mi Piace