CSS: icon ​

.instui-icon — Az ikonrendszer: a .instui-icon méretezése és a közös -icon-<name> festő, amely egy glypht maszkol (a currentColor színben) bármely elem előtt.

Source: icon.css

Hozzáférhetőség ​

A glifa dekoratív, ezért jelölje aria-hidden="true"-vel; adjon neki role-t vagy címkét csak akkor, ha az ikon önmagában jelentést közvetít.

Használat ​

css
@import "@pantoken/components/components.css";

Példák ​

html
<span class="instui-icon -icon-megaphone" aria-hidden="true"></span>

Módosítók ​

MódosítóLeírás
.-icon-*Állítsa be a glif tokent (--pantoken-glyph), és jelenítse meg a megosztott festővel (például -icon-search).

Pseudo-elemek ​

Pseudo-elemLeírás
::beforeMagának a glyfnek: egy 1em-es doboz, amelyet a --pantoken-glyph maszkol, és a currentColor tölti ki.

Fogyasztott tokenek ​

TokenTípusÉrték
--pantoken-glyph<url>url("data:image/svg+xml