CSS: icon

.instui-icon — Sistem ikon: ukuran .instui-icon ditambah pelukis bersama -icon-<name> yang memasker glyph (di currentColor) sebelum elemen apa pun.

Source: icon.css

Aksesibilitas

Glyph bersifat dekoratif, jadi tandai sebagai aria-hidden="true"; berikan role atau label hanya jika ikon menyampaikan makna sendiri.

Penggunaan

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

Contoh

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

Modifikator

Modifikator	Deskripsi
.-icon-*	Tetapkan token glyph (--pantoken-glyph) dan render melalui pelukis bersama (misalnya -icon-search).

Pseudo-elemen

Pseudo-elemen	Deskripsi
::before	Glyph itu sendiri: sebuah kotak 1em yang dimasker dari --pantoken-glyph dan diisi dengan currentColor.

Token yang digunakan

Token	Tipe	Nilai
--pantoken-glyph	<url>	url("data:image/svg+xml