CSS: page-layout ​

div[class~="instui-page-layout"] — פריסת עמוד סטנדרטית בת שלוש עמודות עם כותרת עליונה, סרגל צד ותוכן ראשי.

✅ השתמש ב‑Page-Layout כאשר:

  • אתה צריך מבנה עמוד קלאסי עם ניווט ואזורי תוכן

  • לעמוד יש אזור תוכן מרכזי ברור המוקף באזורים משלימים

  • אתה רוצה ריווח ויישור עקביים בכל הפריסה 🚫 אל תשתמש ב‑Page-Layout כאשר:

  • במקרים של עמוד בעמודה אחת — השתמש בפריסה פשוטה יותר

  • סרגל הצד מתחרה עם התוכן הראשי על החשיבות

נגישות ​

  • מיפוי אזור התוכן הראשי ל‑<main> כנקודת סימון (landmark)
  • תן לסרגל הצד role="navigation" או role="complementary" לפי הצורך
  • וודא שלאזורים המסומנים יש aria-labels מובחנים

שימוש ​

css
@import "@pantoken/plugin-layouts/layouts.css";

חלקים ​

חלקתיאור
.instui-bodyגוף ראשי המכיל את סרגל הצד והתוכן.
.instui-footerאזור הכותרת התחתונה.
.instui-headerאזור הכותרת העליונה.
.instui-mainאזור התוכן המרכזי.
.instui-sidebarעמודת ניווט שמאלית או עמודת עזר.

מצבים ​

מצבתיאור
:optional—

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

Tokenסוגערך
--instui-color-border——
--instui-color-footer-background——
--instui-color-footer-text——
--instui-color-header-background——
--instui-color-sidebar-background——
--instui-font-size-small<length>—
--instui-space-medium——

קשור ​