@use "../../libs/css/mixin" as *;
@use "../../libs/css/theme" as *;

@include b(grid) {
  justify-content: center;
  @include flex;
  flex-wrap: wrap;
  align-items: center;
  // 在uni-app中应尽量避免使用flex布局以外的方式,因为nvue/uvue等方案都支持flex布局
  // 这里使用grid布局使用为目前20240409uni-app在抖音小程序开启virtualHost时有bug，存在事件失效问题。
  /* #ifndef APP-NVUE */
  display: grid;
  /* #endif */
  @include e(item) {
    align-items: center;
    justify-content: center;
    position: relative;
    flex-direction: column;
    overflow: hidden;
    /* #ifndef APP-NVUE */
    box-sizing: border-box;
    display: flex;
    /* #endif */

    /* #ifdef MP */
    position: relative;
    float: left;
    /* #endif */

    @include m(hover-class) {
      opacity: 0.7;
    }
  }
}