Colori

Una serie di classi di utilità per applicare colori a testi e sfondi.

Accessibilità

Bootstrap AUSLBO eredita gli stessi meccanisimi per la gestione dei colori di Bootstrap 4.5.0, dove i colori del tema sono descritti attraverso una variabile Sass nominata $theme-colors.

Come colore primario è stata scelta una variazione del verde del logo che ne permetta un migliore contrasto su sfondo bianco.

Come colore per i messeggi di conferma (success) è stata scelta una tonalità di blu, per distinguerlo dal verde che è comunemente usato per questo scopo.

Colore del testo

<p class="p-3 mb-2 text-primary">.text-primary</p>
<p class="p-3 mb-2 text-secondary">.text-secondary</p>
<p class="p-3 mb-2 text-success">.text-success</p>
<p class="p-3 mb-2 text-danger">.text-danger</p>
<p class="p-3 mb-2 text-warning">.text-warning</p>

Colore di sfondo

Allo stesso modo di quanto avviene per il testo, le classi bg-* permettono di colorare lo sfondo di un elemento; le classi per gli sfondi non hanno alcun impatto sulla proprità color, per cui in alcuni casi sarà necessario affiancarle alle classi .text-*.

<div class="p-3 mb-2 bg-primary text-white">.bg-primary</div>
<div class="p-3 mb-2 bg-secondary text-white">.bg-secondary</div>
<div class="p-3 mb-2 bg-success text-white">.bg-success</div>
<div class="p-3 mb-2 bg-danger text-white">.bg-danger</div>
<div class="p-3 mb-2 bg-warning text-white">.bg-warning</div>

Colore di sfondo con gradiente

Bootstrap AUSL-BO eredita da Bootstrap la possibilità di avere sfondi con gradiente. Tale funzionalità è stata attivata esplicitamente impostando la variabile SASS $enable-gradients, e ricompilando i file sorgente.

Si possono trovare maggiori informazioni a riguardo sul sito di Bootstrap.