//------------------------------------------------------------------------------
// @tool: Background Triangle
//------------------------------------------------------------------------------
// @author: hanakin -- midaym
// @version: 1.0.2
// @description
//
// Adds a downward-facing triangle as a background image to an element.
// The image is formatted as an SVG, making it easy to change the color.
// Because Internet Explorer doesn't support encoded SVGs as background images,
// a fallback is also included.
//
//------------------------------------------------------------------------------

//
// @scss
@mixin background-triangle($color: $black) {
	background-image: url('data:image/svg+xml,%3Csvg xmlns="http://www.w3.org/2000/svg" width="36px" height="36px" viewBox="0 0 24 24"%3E%3Cpath fill-rule="evenodd" style="fill:#{$color}" d="M12 16c-.297 0-.578-.133-.768-.359l-5-6A1.001 1.001 0 0 1 7 8h10a1 1 0 0 1 .767 1.64l-5 6A1 1 0 0 1 12 16zm-2.865-6L12 13.437l2.865-3.438h-5.73V10z"%3E%3C/path%3E%3C/svg%3E');
}