// Flex
.#{$prefix}flex {
  /* #ifndef APP-NVUE */
  display: flex !important;
  /* #endif */
}
.#{$prefix}flex-center {
  /* #ifndef APP-NVUE */
  display: flex !important;
  /* #endif */
  justify-content: center !important;
  align-items: center !important;
}
// Flex Basis

// 行内 Flex

// Flex 方向
.#{$prefix}flex-row {
  flex-direction: row !important;
}
.#{$prefix}flex-row-reverse {
  flex-direction: row-reverse !important;
}
.#{$prefix}flex-col {
  flex-direction: column !important;
}
.#{$prefix}flex-col-reverse {
  flex-direction: column-reverse !important;
}

// Flex Wrap
.#{$prefix}flex-wrap {
  flex-wrap: wrap !important;
}
.#{$prefix}flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}
.#{$prefix}flex-nowrap {
  flex-wrap: nowrap !important;
}

/* #ifndef APP-NVUE */
// Flex Stretch
// .#{$prefix}flex-1 {
//   flex: 1 1 0%;
// }
.#{$prefix}flex-auto {
  flex: 1 1 auto;
}
.#{$prefix}flex-initial {
  flex: 0 1 auto;
}
.#{$prefix}flex-none {
  flex: none;
}
/* #endif */

// flex: {1~16} !important;
@for $i from 1 through 16 {
  .#{$prefix}flex-#{$i} {
    flex: $i !important;
  }
}

/* #ifndef APP-NVUE */
// Flex Grow
.#{$prefix}flex-grow-0 {
  flex-grow: 0;
}
.#{$prefix}flex-grow {
  flex-grow: 1;
}

// Flex Shrink
.#{$prefix}flex-shrink-0 {
  flex-shrink: 0;
}
.#{$prefix}flex-shrink {
  flex-shrink: 1;
}
/* #endif */