aloverso
8/5/2019 - 7:51 PM

borders.scss

borders.scss

$color-border-soft: #ccc;

// border
$border_sizes:
  (l, 5px), //large
  (m, 2px), //medium
  (d, 1px)  //default
;

@each $border_sizes, $size in $border_sizes {
  .ba#{$border_sizes} {
    border: $size solid $color-border-soft;
  }
}
@each $border_sizes, $size in $border_sizes {
  .brad#{$border_sizes} {
    border-radius: $size;
  }
}
@each $direction_list, $direction in $direction_list {
  @each $border_sizes, $width in $border_sizes {
    @if $border_sizes != "" {
      .b#{$direction_list}#{$border_sizes} {
        border-#{$direction}: $width solid $color-border-soft;
      }
    }
    @else  {
      .b#{$direction_list} {
        border-#{$direction}: $width solid $color-border-soft;
      }
    }
  }
}
@each $orientation_list, $orientation in $orientation_list {
  @each $border_sizes, $size in $border_sizes {
    $hyphen: '';
    @if $space_sizes != ''{
      $hyphen: '-';
    }
    @if $orientation_list == "v" {
      .b#{$orientation_list}#{$border_sizes} {
        border-bottom: $size;
        border-top: $size;
      }
    }
    @else if $orientation_list == "h" {
      .b#{$orientation_list}#{$border_sizes} {
        border-left: $size;
        border-right: $size;
      }
    }
  }
}