Icon

shadow

Tento komponent poskytuje jednoduchý spôsob zobrazenia ikon zo sady SVG obrázkov, pričom umožňuje rôzne možnosti prispôsobenia. WebJET Elements využíva sadu ikon Tabler. Zoznam všetkých dostupných ikon nájdete na tabler-icons.io.

Základné použitie

Ukážka zobrazuje použitie ikony v najjednoduchšej podobe, teda ako samostatný vizuálny prvok s predvoleným menom.

Štýl Outline / Filled

Ukážka porovnáva outline a filled varianty tej istej ikony, aby bolo ľahšie vybrať vhodný štýl pre konkrétny kontext.

Custom

Ukážka sa sústreďuje na použitie vlastnej ikony mimo predvolenej sady, čo je vhodné pri brandových alebo projektových ikonách.

Kedy použiť

Použite wje-icon na zobrazenie obsahu, ktorý zlepšuje čitateľnosť, skenovateľnosť alebo kontext informácií.

Kedy nepoužiť

Nepoužívajte ho ako náhradu za štruktúrované dáta tam, kde je potrebná presná interakcia.

Prístupnosť

Doplňte alternatívny text pre obrázky, čitateľné kontrasty a textové ekvivalenty pre ikony bez popisu.

Odporúčané postupy

• Komprimujte médiá a používajte lazy loading pri veľkých zoznamoch.
• Pri kartách a zoznamoch držte konzistentné informačné priority.
• Neopakujte rovnakú informáciu súčasne textom aj ikonou bez pridanej hodnoty.

Atribúty a vlastnosti

filled

Popis	Riadi správanie voľby filled v komponente.
Atribút	filled
Typ	any
Predvolené	-

label

Popis	Nastavuje zobrazený alebo prístupný textový štítok.
Atribút	label
Typ	any
Predvolené	-

name

Popis	Nastavuje názov poľa pri odoslaní formulára.
Atribút	name
Typ	any
Predvolené	-

Udalosti

Pre tento komponent nie sú dostupné žiadne udalosti.

Metódy

Pre tento komponent nie sú dostupné žiadne verejné metódy.

CSS tieňové časti

Názov	Popis
svg	Štýluje shadow časť svg.

CSS vlastné premenné

Názov	Popis
--wje-icon-size	Vlastná CSS premenná na štýlovanie komponentu (size).
--wje-icon-width	Vlastná CSS premenná, ktorá riadi width.
--wje-icon-height	Vlastná CSS premenná, ktorá riadi height.

Sloty

Pre tento komponent nie sú dostupné žiadne sloty.