$border-sides: 'top' 'left' 'right' 'bottom'

.is-borderless
  border: none !important

+mobile
  .is-borderless-mobile
    border: none !important

+tablet
  .is-borderless-tablet
    border: none !important

+touch
  .is-borderless-touch
    border: none !important
+desktop
  .is-borderless-desktop
    border: none !important
+widescreen
  .is-borderless-widescreen
    border: none !important
+fullhd
  .is-borderless-fullhd
    border: none !important

.has-border
  border: 1px solid $border
  border-radius: $radius

@each $border-side in $border-sides
  .has-border-#{$border-side}
    border-#{$border-side}: 1px solid $border

@each $name, $pair in $colors
  $color: nth($pair, 1)
  .has-border-#{$name}
    border: solid 1px $color
  @each $border-side in $border-sides
    .has-border-#{$border-side}-#{$name}
      border-#{$border-side}: solid 1px $color
