@mixin border-wariant($parent, $bg){
$color: mix($bg, #fff, 10%);
.b-#{$parent}{
border-color: $bg;
}
.b-t-#{$parent}{
border-top-color: $bg;
}
.b-r-#{$color}{
border-right-color: $bg;
}
.b-b-#{$parent}{
border-bottom-color: $bg;
}
.b-l-#{$parent}{
border-left-color: $bg;
}
}
.no-border{
border-color:
transparent;
border-width:0;
}
.no-borders{
border-width:0 !important;
}
.b{
border-color: $border-color;
background-clip: padding-box;
}
.b-a{
border: 1px solid $border-color;
}
.b-t{
border-top: 1px solid $border-color;
}
.b-r{
border-right: 1px solid $border-color;
}
.b-b{
border-bottom: 1px solid $border-color;
}
.b-l{
border-left: 1px solid $border-color;
}
.b-2x{
border-width: 2px;
}
.b-3x{
border-width: 3px;
}
.b-4x{
border-width: 4px;
}
.b-5x{
border-width: 5px;
}
.b-t-2x{
border-top-width: 2px !important;
}
.b-t-3x{
border-top-width: 3px !important;
}
.b-t-4x{
border-top-width: 4px !important;
}
.b-t-5x{
border-top-width: 5px !important;
}
.b-r-2x{
border-right-width: 2px !important;
}
.b-r-3x{
border-right-width: 3px !important;
}
.b-r-4x{
border-right-width: 4px !important;
}
.b-r-5x{
border-right-width: 5px !important;
}
.b-b-2x{
border-bottom-width: 2px !important;
}
.b-b-3x{
border-bottom-width: 3px !important;
}
.b-b-4x{
border-bottom-width: 4px !important;
}
.b-b-5x{
border-bottom-width: 5px !important;
}
.b-l-2x{
border-left-width: 2px !important;
}
.b-l-3x{
border-left-width: 3px !important;
}
.b-l-4x{
border-left-width: 4px !important;
}
.b-l-5x{
border-left-width: 5px !important;
}
.b-light{
border-color: $light;
}
.b-white{
border-color: #fff;
}
@include border-wariant(primary, $primary);
@include border-wariant(accent, $accent);
@include border-wariant(warn, $warn);
@include border-wariant(success, $success);
@include border-wariant(info, $info);
@include border-wariant(warning, $warning);
@include border-wariant(danger, $danger);
@include border-wariant(light, $light);
@include border-wariant(grey, $grey);
@include border-wariant(dark, $dark);
@include border-wariant(black, $black);
@include border-wariant(white, $white);
@include border-wariant(blue, $blue);
.no-b-t{
border-top-width: 0;
}
.no-b-r{
border-right-width: 0;
}
.no-b-b{
border-bottom-width: 0;
}
.no-b-l{
border-left-width: 0;
}
.b-dashed{
border-style: dashed !important;
}
@media (max-width: 991px) {
.no-border-sm{border-width: 0;}
}
@media (max-width: 767px) {
.no-border-xs{border-width: 0;}
}