CSS: icon ​

.instui-icon — Sistem ikon: saiz .instui-icon ditambah pelukis bersama -icon-<name> yang menutup glif (dalam currentColor) sebelum sebarang elemen.

Source: icon.css

Aksesibiliti ​

Glif itu hiasan, jadi tandakan ia aria-hidden="true"; berikan ia role atau label hanya apabila ikon menyampaikan maksud dengan sendirinya.

Penggunaan ​

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

Contoh ​

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

Pemodifikasi ​

PemodifikasiPenerangan
.-icon-*Tetapkan token glif (--pantoken-glyph) dan papar ia melalui pelukis bersama (contohnya -icon-search).

Pseudo-elemen ​

Pseudo-elemenPenerangan
::beforeGlif itu sendiri: kotak 1em yang dimaskkan daripada --pantoken-glyph dan diisi dengan currentColor.

Token digunakan ​

TokenJenisNilai
--pantoken-glyph<url>url("data:image/svg+xml