CSS: icon ​

.instui-icon — מערכת האייקונים: גודל .instui-icon לצד הצובע המשותף -icon-<name> שמחיל מסיכה על גליף (ב־currentColor) לפני כל אלמנט.

Source: icon.css

נגישות ​

הגליף הוא דקורטיבי, לכן סמן אותו כ־aria-hidden="true"; הענק לו role או תווית רק כאשר האייקון מעביר משמעות בעצמו.

שימוש ​

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

דוגמאות ​

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

מחליפים ​

מחליףתיאור
.-icon-*הגדר את אסימון הגליף (--pantoken-glyph) והצג אותו באמצעות הצובע המשותף (לדוגמה -icon-search).

פיסואו־אלמנטים ​

פיסואו־אלמנטתיאור
::beforeהגליף עצמו: תיבה בגודל 1em שמחולצת מ־--pantoken-glyph וממולאת ב־currentColor.

אסימוני צריכה ​

Tokenסוגערך
--pantoken-glyph<url>url("data:image/svg+xml