/**
 * File: basic/_border.scss
 * Type: SASS partial
 * Author: Chris Humboldt
 */

// Table of contents
// Border lines
// Border radius
// Border shades

// Border lines
@mixin border($colour: $grey, $size: 1px, $type: solid) {
	border: $size $type $colour;
}
@mixin border-top($colour: $grey, $size: 1px, $type: solid) {
	border-top: $size $type $colour;
}
@mixin border-bottom($colour: $grey, $size: 1px, $type: solid) {
	border-bottom: $size $type $colour;
}
@mixin border-left($colour: $grey, $size: 1px, $type: solid) {
	border-left: $size $type $colour;
}
@mixin border-right($colour: $grey, $size: 1px, $type: solid) {
	border-right: $size $type $colour;
}
@mixin border-vertical($colour: $grey, $size: 1px, $type: solid) {
	@include border-top($colour, $size, $type);
	@include border-bottom($colour, $size, $type);
}
@mixin border-horizontal($colour: $grey, $size: 1px, $type: solid) {
	@include border-left($colour, $size, $type);
	@include border-right($colour, $size, $type);
}
@mixin border-no() {
	border: medium none $black;
}

// Border radius
@mixin border-radius($radius: 2px) {
	border-radius: $radius;
	-o-border-radius: $radius;
	-ms-border-radius: $radius;
	-moz-border-radius: $radius;
	-webkit-border-radius: $radius;
	background-clip: padding-box;
}
@mixin border-radius-top($radius: 2px) {
	border-radius: $radius $radius 0px 0px;
	-o-border-radius: $radius $radius 0px 0px;
	-ms-border-radius: $radius $radius 0px 0px;
	-moz-border-radius: $radius $radius 0px 0px;
	-webkit-border-radius: $radius $radius 0px 0px;
	background-clip: padding-box;
}
@mixin border-radius-bottom($radius: 2px) {
	border-radius: 0px 0px $radius $radius;
	-o-border-radius: 0px 0px $radius $radius;
	-ms-border-radius: 0px 0px $radius $radius;
	-moz-border-radius: 0px 0px $radius $radius;
	-webkit-border-radius: 0px 0px $radius $radius;
	background-clip: padding-box;
}
@mixin border-radius-left($radius: 2px) {
	border-radius: $radius 0px 0px $radius;
	-o-border-radius: $radius 0px 0px $radius;
	-ms-border-radius: $radius 0px 0px $radius;
	-moz-border-radius: $radius 0px 0px $radius;
	-webkit-border-radius: $radius 0px 0px $radius;
	background-clip: padding-box;
}
@mixin border-radius-right($radius: 2px) {
	border-radius: 0px $radius $radius 0px;
	-o-border-radius: 0px $radius $radius 0px;
	-ms-border-radius: 0px $radius $radius 0px;
	-moz-border-radius: 0px $radius $radius 0px;
	-webkit-border-radius: 0px $radius $radius 0px;
	background-clip: padding-box;
}
@mixin border-radius-top-right($radius: 2px) {
	border-radius: 0px $radius 0px 0px;
	-o-border-radius: 0px $radius 0px 0px;
	-ms-border-radius: 0px $radius 0px 0px;
	-moz-border-radius: 0px $radius 0px 0px;
	-webkit-border-radius: 0px $radius 0px 0px;
	background-clip: padding-box;
}
@mixin border-radius-top-left($radius: 2px) {
	border-radius: $radius 0px 0px 0px;
	-o-border-radius: $radius 0px 0px 0px;
	-ms-border-radius: $radius 0px 0px 0px;
	-moz-border-radius: $radius 0px 0px 0px;
	-webkit-border-radius: $radius 0px 0px 0px;
	background-clip: padding-box;
}
@mixin border-radius-bottom-right($radius: 2px) {
	border-radius: 0px 0px $radius 0px;
	-o-border-radius: 0px 0px $radius 0px;
	-ms-border-radius: 0px 0px $radius 0px;
	-moz-border-radius: 0px 0px $radius 0px;
	-webkit-border-radius: 0px 0px $radius 0px;
	background-clip: padding-box;
}
@mixin border-radius-bottom-left($radius: 2px) {
	border-radius: 0px 0px 0px $radius;
	-o-border-radius: 0px 0px 0px $radius;
	-ms-border-radius: 0px 0px 0px $radius;
	-moz-border-radius: 0px 0px 0px $radius;
	-webkit-border-radius: 0px 0px 0px $radius;
	background-clip: padding-box;
}
@mixin border-radius-no() {
	border-radius: 0px;
	-o-border-radius: 0px;
	-ms-border-radius: 0px;
	-moz-border-radius: 0px;
	-webkit-border-radius: 0px;
	background-clip: padding-box;
}

// Border shades
@mixin border-light($highlight: 0.8, $colour: #ffffff) {
	border: 1px solid fade-out($colour, $highlight);
}
@mixin border-light-top($highlight: 0.8, $colour: #ffffff) {
	border-top: 1px solid fade-out($colour, $highlight);
}
@mixin border-light-bottom($highlight: 0.8, $colour: #ffffff) {
	border-bottom: 1px solid fade-out($colour, $highlight);
}
@mixin border-light-left($highlight: 0.8, $colour: #ffffff) {
	border-left: 1px solid fade-out($colour, $highlight);
}
@mixin border-light-right($highlight: 0.8, $colour: #ffffff) {
	border-right: 1px solid fade-out($colour, $highlight);
}
@mixin border-dark($lowlight: 0.8, $colour: #000000) {
	border: 1px solid fade-out($colour, $lowlight);
}
@mixin border-dark-top($lowlight: 0.8, $colour: #000000) {
	border-top: 1px solid fade-out($colour, $lowlight);
}
@mixin border-dark-bottom($lowlight: 0.8, $colour: #000000) {
	border-bottom: 1px solid fade-out($colour, $lowlight);
}
@mixin border-dark-left($lowlight: 0.8, $colour: #000000) {
	border-left: 1px solid fade-out($colour, $lowlight);
}
@mixin border-dark-right($lowlight: 0.8, $colour: #000000) {
	border-right: 1px solid fade-out($colour, $lowlight);
}
