Elválasztó és Lista elem

Elválasztó elem

Az Elválasztó elem vízszintes vagy függőleges elválasztó vonalat rajzol, amelyre ikont is tehetsz.

https://minta-bolt.hu/elemek/?bricks=run

A képen a Magasság, a Szélesség, a Stílus, az Irány, az Igazítás és a Szín mezője, alattuk az Ikon csoport látszik.

Beállítás	Mit csinál	Alapérték
Magasság	A vonal vastagsága (mértékegységgel).	1
Szélesség	A vonal hossza.
Stílus	A vonal stílusa: solid, dashed, dotted, double, groove, ridge, inset, outset.	Folytonos
Irány	A vonal iránya: vízszintes vagy függőleges.	Vízszintes
Igazítás	A vonal igazítása a tárolóján belül: elejére, középre vagy végére.
Szín	A vonal és az ikon színe.

Ikon

Beállítás	Mit csinál
Ikon	A vonalon megjelenő ikon.
Tipográfia	Az ikon stílusa (méret, betűbeállítások). Csak kiválasztott ikonnál érhető el.

Lista elem

A Lista elem testreszabható listát készít ikonokkal, címekkel, meta információval, leírással és opcionális kiemelő felirattal.

https://minta-bolt.hu/elemek/?bricks=run

A képen a Listaelemek ismétlődő mező (egy „Első elem” tétellel), az Elem hozzáadása gomb, alatta a Listaelem, Kiemelés, Ikon, Cím, Meta, Leírás és Elválasztó csoport látszik.

Listaelemek

A Listaelemek ismétlődő mezőben vehetsz fel és állíthatsz be elemeket. Minden elemnek ezek a mezői vannak:

Mező	Mit csinál
Ikon	Nem kötelező ikon az elemhez.
Cím	A fő cím szövege.
Link címe	A cím kattinthatóvá tétele.
Meta	Kiegészítő információ, például ár vagy dátum.
Leírás	Hosszabb leírás.
Kiemelés	Kiemeltként jelöli az elemet.
Kiemelés felirata	Egyéni felirat a kiemelt elemhez. Csak bekapcsolt kiemelésnél érhető el.

Listaelem

Beállítás	Mit csinál
Tartalom igazítása	Az elem tartalmának vízszintes igazítása (justify-content).
Elemek igazítása	Az elem tartalmának függőleges igazítása: elejére, középre, végére vagy alapvonalra.
Margó	Az egyes listaelemek külső távolsága.
Kitöltés	Az egyes listaelemek belső távolsága.
Páratlan háttér	A páratlan sorszámú elemek háttérszíne.
Páros háttér	A páros sorszámú elemek háttérszíne.
Szegély	A listaelemek szegélye.
Automatikus szélesség	Bekapcsolva az elemek tartalmuk szélességét veszik fel, az elválasztó vonal nem nő.

Kiemelés

A kiemelt elemek felirata és tartalma külön stílust kap.

Beállítás	Mit csinál
Blokk	A kiemelő feliratot blokk elemként jeleníti meg.
Kitöltés, Háttér, Szegély, Tipográfia	A kiemelő felirat belső távolsága, háttere, szegélye és betűstílusa.
Tartalom csoport: Kitöltés, Háttér, Szegély	A kiemelt elem tartalmának belső távolsága, háttere és szegélye.
Szöveg színe	A kiemelt elem címének, metájának és leírásának színe.

Ikon

Beállítás	Mit csinál
Ikon	Az összes listaelem alapértelmezett ikonja.
Cím után	Az ikont a cím után helyezi el, előtte helyett.
Szélesség, Magasság	Az ikon szélessége és magassága.
Méret	Az ikon betűmérete, illetve az SVG szélessége és magassága.
Szín	Az ikon színe.
Háttérszín	Az ikon háttérszíne.
Szegély	Az ikon szegélye.
Dobozárnyék	Az ikon árnyéka.

Cím, Meta, Leírás

Csoport	Beállítás	Mit csinál
Cím	Margó	A cím külső távolsága.
Cím	HTML-címke	A cím HTML-címkéje. Dinamikus adatot is elfogad, a helykitöltő span.
Cím	Tipográfia	A cím betűstílusa.
Meta	Margó, Tipográfia	A meta szöveg külső távolsága és betűstílusa.
Leírás	Tipográfia	A leírás betűstílusa.

Elválasztó

A listaelemek közti vonal beállításai.

Beállítás	Mit csinál
Kikapcsolás	Eltünteti az elemek közti elválasztó vonalat.
Stílus	A vonal szegélystílusa.
Szélesség	A vonal szélessége.
Magasság	A vonal vastagsága.
Szín	A vonal színe.

A Stílus, a Szélesség, a Magasság és a Szín csak akkor érhető el, ha az elválasztó nincs kikapcsolva.