Creare CSS personalizzati per i prefissi delle discussioni

[Il Custode]

Grazie alle indicazioni di Brogan, vediamo in questo topic un approfondimento sulle classi CSS personalizzate per i prefissi discussioni.

Il codice CSS che segue va aggiunto al template EXTRA.css del vostro stile in uso.

In questo esempio, andiamo a creare due classi: CTA1 e CTA2.
Ovviamente si possono scegliere i nomi che si preferiscono.

.prefix.prefix[COLOR=#ff0000]CTA1[/COLOR] {
color: @textCtrlBackground;
background-color: @primaryDarker;
border-color: @primaryDark;
}
    a.prefixLink:hover .prefix.prefixCTA1 {
    color: red;
    background-color: yellow;
    border-color: blue;
    }
 
.prefix.prefix[COLOR=#0000ff]CTA2[/COLOR] {
color: @textCtrlBackground;
background-color: @primaryLightish;
border-color: @primaryMedium;
}
    a.prefixLink:hover .prefix.prefixCTA2 {
    color: black;
    background-color: white;
    border-color: red;
    }

Come si può vedere, il codice CSS è piuttosto semplice e consiste di solo testo, sfondo e colori del bordo. Si possono aggiungere le personalizzazioni che si desiderano.

Ogni classe ha del codice CSS per l'effetto hover, così ogni prefisso può potenzialmente avere un effetto hover diverso.

Per applicare questi CSS basterà inserire nell'apposito campo di configurazione del prefisso:

 prefix prefixCTA1

Notare che è stato eliminato il punto prima del nome delle classi e che le classi sono separate da uno spazio.