A Material Design 3 és Web Components alapú új mdui 2 már elérhető, tekintse meg az mdui 2 dokumentációját.

Elválasztó

Az elválasztók a tartalom kezelésére és elválasztására szolgálnak a listákban és az oldalak elrendezéseiben, hogy jobb vizuális hatást és térérzetet biztosítsanak.

Használat

Az elválasztó tiszta CSS-szel készült, a használatához elegendő a HTML-kód megírása.

Színek

Sötét elválasztó, világos háttérhez
Világos elválasztó, sötét háttérhez
Automatikusan alkalmazkodó elválasztó, amely az oldal témájától függően vált sötét vagy világos színre

Kapcsolódó olvasmányok

Material Design tervezési irányelvek: Komponensek – Elválasztó

Stílus

Teljes szélességű elválasztó

A teljes szélességű elválasztó a szélesség 100%-át foglalja el. A használható osztálynevek a következők:

mdui-divider: Sötét az alapértelmezett témában, világos a sötét témában.
mdui-divider-light: Világos elválasztó, sötét háttéren való használatra.
mdui-divider-dark: Sötét elválasztó, világos háttéren való használatra.

Példa

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

Behúzott elválasztó

A behúzott elválasztó 72 képpont távolságra van a bal oldaltól, gyakran használják avatarokat vagy ikonokat tartalmazó listákban. A használható osztálynevek a következők:

mdui-divider-inset: Sötét az alapértelmezett témában, világos a sötét témában.
mdui-divider-inset-light: Világos behúzott elválasztó, sötét háttérhez.
mdui-divider-inset-dark: Sötét behúzott elválasztó, világos háttérhez.

Példa

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

CSS osztályok listája

Osztálynév	Leírás
`.mdui-divider`	Elválasztó meghatározása. Sötét az alapértelmezett témában, világos a sötét témában.
`.mdui-divider-light`	Világos elválasztó meghatározása, sötét háttérhez.
`.mdui-divider-dark`	Sötét elválasztó meghatározása, világos háttérhez.
`.mdui-divider-inset`	Behúzott elválasztó meghatározása. Sötét az alapértelmezett témában, világos a sötét témában.
`.mdui-divider-inset-light`	Világos behúzott elválasztó meghatározása, sötét háttérhez.
`.mdui-divider-inset-dark`	Sötét behúzott elválasztó meghatározása, világos háttérhez.

Választómező

Összecsukható panel