Fondation - Menu Référence SASS

Variables

Vous pouvez modifier les styles des composants à l'aide des variables SASS suivantes, comme indiqué dans le tableau.

N ° Sr.	Nom et description	Type	Valeur par défaut
1	$menu-margin Définit la marge dans le menu.	Nombre	0
2	$menu-margin-nested Définit la marge pour le côté gauche dans un menu imbriqué.	Nombre	1rem
3	$menu-item-padding 0,7rem 1rem	Nombre	Définit le remplissage dans le menu.
4	$menu-icon-spacing Définit l'espace entre le texte et l'icône dans l'élément de menu.	Nombre	0,25rem
5	$menu-expand-max Inclut le nombre maximum de classes expand-n dans le CSS.	Nombre	6

Vous pouvez utiliser les mixins pour créer la structure de classe CSS pour vos composants comme indiqué dans le tableau.

Le style de base est créé pour le menu.

@include menu-base;

Développez l'élément de menu à la même largeur.

@include menu-expand($count);

N ° Sr.	Nom et description	Type	Valeur par défaut
1	$count Nombre d'éléments dans le menu.	Mot-clé ou numéro	auto

La direction du menu est définie.

@include menu-direction($dir);

N ° Sr.	Nom et description	Type	Valeur par défaut
1	$dir Définit la direction du menu horizontalement ou verticalement.	Mot-clé	horizontal

Un menu simple est créé sans remplissage ni état de survol.

@include menu-simple;

Les styles sont inclus pour le menu imbriqué. Comprendremargin-left au menu.

@include menu-nested($padding);

N ° Sr.	Nom et description	Type	Valeur par défaut
1	$padding Définit la longueur de la marge.	Mot-clé ou numéro	auto

Les icônes sont incluses dans l'élément de menu.

@include menu-icons($position, $base);

N ° Sr.	Nom et description	Type	Valeur par défaut
1	$position Définissez la position des icônes.	Mot-clé	côté
2	$base Pour appeler mixin plusieurs fois sur le même élément, définissez-le sur false.	Booléen	vrai