row

row.ts

• RowJustify
• RowAlign
• rowProps

row.vue

gutter: https://getbootstrap.com/docs/5.0/layout/gutters/

设置 html attribute

  <component :is="tag" :class="rowKls" :style="style">
    <slot />
  </component>

provide context

provide(rowContextKey, {
  gutter,
})

packages\theme-chalk\src\row.scss

@include b(row) {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  box-sizing: border-box;

  @include when(justify-center) {
    justify-content: center;
  }
  @include when(justify-end) {
    justify-content: flex-end;
  }
  @include when(justify-space-between) {
    justify-content: space-between;
  }
  @include when(justify-space-around) {
    justify-content: space-around;
  }
  @include when(justify-space-evenly) {
    justify-content: space-evenly;
  }
  @include when(align-middle) {
    align-items: center;
  }
  @include when(align-bottom) {
    align-items: flex-end;
  }
}