CSS: gap ​

.--gap-md — 在間距刻度上的 Flex/grid gap 工具，短寫（--gap-sm）或長寫（--gap-small）。可單獨使用或串接到任何元件（.instui-view.--gap-sm）— 已從組件專用 token 設定自己 gap 的元件可能會被覆寫。

Source: index.ts

使用方法 ​

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

示範 ​

範例 ​

html
<div class="--display-flex --gap-sm">
  <span>One</span>
  <span>Two</span>
</div>

修飾器 ​

修飾器說明
.--gap-md將中等間距的 token 套用為間隙。
.--gap-*支援短寫與長寫間距步階拼寫的間隙工具。

已使用的代幣 ​

Token型別值
--instui-component-shared-tokens-spacing-general-space-none<length>0rem
--instui-spacing-space-lg<length>1rem
--instui-spacing-space-md<length>0.75rem
--instui-spacing-space-sm<length>0.5rem
--instui-spacing-space-xl<length>1.5rem
--instui-spacing-space-xs<length>0.25rem
--instui-spacing-space2xl<length>2rem
--instui-spacing-space2xs<length>0.125rem