You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
78 lines
1.3 KiB
78 lines
1.3 KiB
4 years ago
|
@import "var";
|
||
|
|
||
|
.border {
|
||
|
border: 1px solid $color-border;
|
||
|
}
|
||
|
|
||
|
// vertical
|
||
|
.b-v {
|
||
|
border-top: 1px solid $color-border;
|
||
|
border-bottom: 1px solid $color-border;
|
||
|
}
|
||
|
|
||
|
// horizontal
|
||
|
.b-h {
|
||
|
border-left: 1px solid $color-border;
|
||
|
border-right: 1px solid $color-border;
|
||
|
}
|
||
|
|
||
|
// border double
|
||
|
.b-double {
|
||
|
border: double $color-border;
|
||
|
}
|
||
|
|
||
|
.b-w-thin {
|
||
|
border-width: 0.55px;
|
||
|
}
|
||
|
|
||
|
.b-round {
|
||
|
border-radius: 50%;
|
||
|
}
|
||
|
|
||
|
.b-none {
|
||
|
border: none;
|
||
|
}
|
||
|
|
||
|
@each $side in left, right, top, bottom {
|
||
|
.b-#{str-slice($side, 0, 1)} {
|
||
|
border-#{$side}: 1px solid $color-border;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// border-style
|
||
|
@each $style in dotted, dashed {
|
||
|
.border-#{$style} {
|
||
|
border: 1px $style $color-border
|
||
|
}
|
||
|
.b-v-#{$style} {
|
||
|
border-top: 1px $style $color-border;
|
||
|
border-bottom: 1px $style $color-border;
|
||
|
}
|
||
|
.b-h-#{$style} {
|
||
|
border-left: 1px $style $color-border;
|
||
|
border-right: 1px $style $color-border;
|
||
|
}
|
||
|
@each $side in left, right, top, bottom {
|
||
|
.b-#{str-slice($side, 0, 1)}-#{$style} {
|
||
|
border-#{$side}: 1px $style $color-border;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
@for $size from 0 through $border-width-through {
|
||
|
.b-#{$size} {
|
||
|
border-width: #{$size}px;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
@for $size from 0 through $border-radius-through {
|
||
|
.b-radius-#{$size}, .b-r-#{$size} {
|
||
|
border-radius: #{$size}px;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
@each $name, $color in $border-colors {
|
||
|
.b-#{$name} {
|
||
|
border-color: $color;
|
||
|
}
|
||
|
}
|