Fondazione - Riferimento Sass off-canvas

Variabili

È possibile modificare gli stili dei componenti utilizzando le seguenti variabili SASS come elencato nella tabella:

Sr.No. Nome e descrizione genere Valore predefinito
1

$offcanvas-size

Specifica la larghezza del menu fuori dall'area di disegno.

 Numero 250px
2

$offcanvas-background

Visualizza il colore di sfondo di un menu fuori tela.

 Colore $ grigio chiaro
3

$offcanvas-zindex

Specifica lo Z-index di un menu fuori dall'area di disegno.

 Numero -1
4

$offcanvas-transition-length

Visualizza la lunghezza dell'animazione in un menu fuori dall'area di disegno.

 Numero 0,5 s
5

$offcanvas-transition-timing

Specifica la funzione di temporizzazione dell'animazione del menu off-canvas.

 Parola chiave facilità
6

$offcanvas-fixed-reveal

Se è vero, un fuori tela rivelato può correggere la posizione della tela rivelato impostandolo su vero.

 vero
7

$offcanvas-exit-background

Visualizza il colore di sfondo per la sovrapposizione del menu fuori tela.

 Colore rgba ($ bianco, 0,25)
8

$maincontent-class

Utilizza la classe CSS per l'area del contenuto principale.

 "contenuto fuori tela"
9

$maincontent-shadow

Visualizza l'ombreggiatura del riquadro per l'area del contenuto principale.

 Ombra 0 0 10px rgba ($ nero, 0,5)
10

$titlebar-background

Visualizza il colore di sfondo di una barra del titolo.

 Colore $ nero
11

$titlebar-color

Definisce il colore del testo per il testo all'interno di una barra del titolo.

 Colore $ bianco
12

$titlebar-padding

Definisce il riempimento all'interno di una barra del titolo.

 Lunghezza 0.5rem
13

$titlebar-text-font-weight

Specifica il peso del carattere del testo.

 Peso grassetto
14

$titlebar-icon-color

Definisce il colore dell'icona della barra del titolo del menu.

 Colore $ bianco
15

$titlebar-icon-color-hover

Definisce il colore dell'icona della barra del titolo del menu al passaggio del mouse.

 Colore $ grigio medio
16

$titlebar-icon-spacing

Specifica la spaziatura tra l'icona del menu e il testo all'interno di una barra del titolo.

 Lunghezza 0.25rem

Mixins

È possibile utilizzare i mixin per creare la struttura delle classi CSS per i componenti come descritto di seguito.

off-canvas-basics

Aggiunge stili per off-canvas e gli stili possono essere inclusi utilizzando il seguente mixin:

@include off-canvas-basics;

base fuori tela

Specifica gli stili di base per il menu fuori dall'area di disegno e puoi includere stili utilizzando il seguente mixin:

@include off-canvas-base;

fuori dalla tela

Specifica gli stili che rivelano il menu fuori dall'area di disegno.

@include off-canvas-reveal($position);

Può essere specificato come definito nella tabella seguente:

Sr.No. Parametro e descrizione genere Valore predefinito
1

$position

Imposta la posizione del menu fuori tela.

 Parola chiave sinistra