@mixin border($width: null, $style: null, $color: null) {
@if $width != null and $style != null and $color != null and
length($width) == 1 and length($style) == 1 and length($color) == 1 {
border: $width $style $color;
} @else {
@if length($width) > 1 and boxContainsNull($width) {
border-top-width: top($width);
border-right-width: right($width);
border-bottom-width: bottom($width);
border-left-width: left($width);
} @else {
border-width: $width;
}
@if length($style) > 1 and boxContainsNull($style) {
border-top-style: top($style);
border-right-style: right($style);
border-bottom-style: bottom($style);
border-left-style: left($style);
} @else {
border-style: $style;
}
@if length($color) > 1 and boxContainsNull($color) {
border-top-color: top($color);
border-right-color: right($color);
border-bottom-color: bottom($color);
border-left-color: left($color);
} @else {
border-color: $color;
}
}
}
@mixin border-top($width: null, $style: null, $color: null) {
@include border-side(top, $width, $style, $color);
}
@mixin border-right($width: null, $style: null, $color: null) {
@include border-side(right, $width, $style, $color);
}
@mixin border-bottom($width: null, $style: null, $color: null) {
@include border-side(bottom, $width, $style, $color);
}
@mixin border-left($width: null, $style: null, $color: null) {
@include border-side(left, $width, $style, $color);
}
@mixin border-side($side, $width: null, $style: null, $color: null) {
@if $width != null and $style != null and $color != null {
border-#{$side}: $width $style $color;
} @else {
border-#{$side}-width: $width;
border-#{$side}-style: $style;
border-#{$side}-color: $color;
}
}