acud/lib/grid/style/rtl.less

acg react 组件库

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

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

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

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

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

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

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

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

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

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