mdui 2 est arrivé, basé sur Material Design 3 et les Web Components. Consultez la documentation de mdui 2 ici.

Séparateur

Les séparateurs servent à gérer et à séparer le contenu des listes et des mises en page afin de procurer une meilleure expérience visuelle et une meilleure perception de l’espace.

Utilisation

Les séparateurs sont écrits en CSS pur ; il suffit d’écrire du code HTML pour qu’ils s’appliquent.

Couleur

Séparateur sombre, utilisé sur fond clair
Séparateur clair, utilisé sur fond sombre
Séparateur dont la couleur s’ajuste automatiquement en fonction du thème de la page

Lecture associée

Spécifications Material Design : Composant - Séparateur

Style

Séparateur pleine largeur

Le séparateur pleine largeur occupe 100 % de la largeur. Les classes utilisables sont :

mdui-divider : couleur sombre dans le thème par défaut, couleur claire dans le thème sombre.
mdui-divider-light : séparateur clair, utilisé sur fond sombre.
mdui-divider-dark : séparateur sombre, utilisé sur fond clair.

Exemple

<div class="mdui-divider"></div>

Séparateur en retrait

Le séparateur en retrait a une marge de 72 px à gauche, souvent utilisé dans les listes avec avatar ou icône. Les classes utilisables sont :

mdui-divider-inset : couleur sombre dans le thème par défaut, couleur claire dans le thème sombre.
mdui-divider-inset-light : séparateur clair, utilisé sur fond sombre.
mdui-divider-inset-dark : séparateur sombre, utilisé sur fond clair.

Exemple

<div class="mdui-divider-inset"></div>

Classes CSS

Nom de classe	Description
`.mdui-divider`	Définit un séparateur. Couleur sombre dans le thème par défaut, couleur claire dans le thème sombre.
`.mdui-divider-light`	Définit un séparateur clair, utilisé sur fond sombre.
`.mdui-divider-dark`	Définit un séparateur sombre, utilisé sur fond clair.
`.mdui-divider-inset`	Définit un séparateur en retrait. Couleur sombre dans le thème par défaut, couleur claire dans le thème sombre.
`.mdui-divider-inset-light`	Définit un séparateur en retrait clair, utilisé sur fond sombre.
`.mdui-divider-inset-dark`	Définit un séparateur en retrait sombre, utilisé sur fond clair.

Sélecteur

Panneau pliable