Skip to content

CSS: drawer-layout.content

.content — Ko te paewhiri ihirangi matua e whakakī ana i te waahi e toe ana i te taha o te paewhiri.

Ka tino whakaitihia te rahi ā-ipurangi (inline-size) o te mātua ki raro ake i te 46em (16em whanui o te paewhiri + 30em wā whatunga), ā, ka whiwhi te pātai @container i runga i te ipu pantoken-drawer-layout o te mātua i te whakaheke aunoa i te min-inline-size o tēnei mema ki 0, e ōrite ana ki te whakakapi ā-ringa [should-overlay-tray].

Wātea mō te katoa

Puritia te role="region" (te tikanga DrawerLayout a InstUI) ā, ingoaia kia whakamahi i te aria-label/aria-labelledby mēnā kāore te horopaki anake e tautuhi.

Ngā Whakamahi

css
@import "@pantoken/components/components.css";
@import "@pantoken/components/drawer-layout.content.css";

Ngā tauira

html
<div class="instui-drawer-layout">
  <div class="content" role="region">
    <p class="instui-text">Tray content</p>
  </div>
</div>

Hanganga

text
@scope (@component drawer-layout)
  .content
    ‹content›
flowchart TD subgraph sg0 ["@scope (@component drawer-layout)"] n1(".content"):::cssdoc-part n2[/"‹content›"/]:::cssdoc-slot end n1 --> n2 classDef cssdoc-root stroke-width:1px; classDef cssdoc-part stroke-width:1px; classDef cssdoc-slot stroke-width:1px; classDef cssdoc-component stroke-width:1px;

Ngā Conditions

MomoPātaiWhakamārama
containerpantoken-drawer-layout (max-width: 46em)

Ngā tohu i whakamahia

TokenMomoUara
--drawer-layout-content-min-inline-size<length>
--pantoken-bp-md<length>30em

Hono