wetrade-design/es/grid/style/rtl.less

一款多语言支持Vue3的UI框架

@import '../../style/themes/index';
@import '../../style/mixins/index';

.@{wd-prefix}-row {
  &-rtl {
    direction: rtl;
  }
}

// mixin
.loop-grid-columns(@index, @class) when (@index > 0) {
  .@{wd-prefix}-col@{class}-push-@{index} {
    // reset property in RTL direction
    &.@{wd-prefix}-col-rtl {
      right: percentage((@index / @grid-columns));
      left: auto;
    }
  }

  .@{wd-prefix}-col@{class}-pull-@{index} {
    // reset property in RTL direction
    &.@{wd-prefix}-col-rtl {
      right: auto;
      left: percentage((@index / @grid-columns));
    }
  }

  .@{wd-prefix}-col@{class}-offset-@{index} {
    // reset property in RTL direction
    &.@{wd-prefix}-col-rtl {
      margin-right: percentage((@index / @grid-columns));
      margin-left: 0;
    }
  }
}

.loop-grid-columns(@index, @class) when (@index = 0) {
  .@{wd-prefix}-col-push-@{index} {
    // reset property in RTL direction
    &.@{wd-prefix}-col-rtl {
      right: auto;
    }
  }

  .@{wd-prefix}-col-pull-@{index} {
    &.@{wd-prefix}-col-rtl {
      left: auto;
    }
  }

  .@{wd-prefix}-col@{class}-push-@{index} {
    &.@{wd-prefix}-col-rtl {
      right: auto;
    }
  }

  .@{wd-prefix}-col@{class}-pull-@{index} {
    &.@{wd-prefix}-col-rtl {
      left: auto;
    }
  }

  .@{wd-prefix}-col@{class}-offset-@{index} {
    &.@{wd-prefix}-col-rtl {
      margin-right: 0;
    }
  }
}