repairForMiniProgram/static/styles/core/mixin.scss

/**
 * 混入定义
 *
 * @since 1.0.0
 * @version 1.0.0
 */

/* 定义1px边框 */
@mixin border-side($side-list, $color, $width: 1) {
  /* todo 抛出错误，提示，未定义颜色值 */
  $top: '';
  $bottom: '';
  $left: '';
  $right: '';
  $image-url: '';

  @each $side, $index in $side-list {
    @if ($side == t) {
      $top: "<line x1='0%' y1='0%' x2='100%' y2='0%' style='stroke:" + $color + ';stroke-width:' + $width + "' />";
    }

    @if ($side == b) {
      $bottom: "<line x1='0%' y1='100%' x2='100%' y2='100%' style='stroke:" +
        $color +
        ';stroke-width:' +
        $width +
        "' />";
    }

    @if ($side == l) {
      $left: "<line x1='0%' y1='0%' x2='0%' y2='100%' style='stroke:" + $color + ';stroke-width:' + $width + "' />";
    }

    @if ($side == r) {
      $right: "<line x1='100%' y1='0%' x2='100%' y2='100%' style='stroke:" +
        $color +
        ';stroke-width:' +
        $width +
        "' />";
    }

    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='100%' height='100%'> " + $top + $bottom + $left + $right + ' </svg>');
  }
}

/* 构建边框序列 */
@mixin generate-border($side-list, $color) {
  .#{$ui-border}.#{$side-list} {
    @include border-side(t b l r, $color);
  }

  .#{$ui-border + '-t'}.#{$side-list} {
    @include border-side(t, $color);
  }

  .#{$ui-border + '-b'}.#{$side-list} {
    @include border-side(b, $color);
  }

  .#{$ui-border + '-l'}.#{$side-list} {
    @include border-side(l, $color);
  }

  .#{$ui-border + '-r'}.#{$side-list} {
    @include border-side(r, $color);
  }
}

/* 多行文本省略，默认省略单行 */
@mixin text-overflow($len: 1) {
  @if $len == 1 {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
  } @else {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $len;
    overflow: hidden;
  }
}