// Only handles right direction for now....base-shape{display:block;content:'';}@mixintriangle($direction:down,$size:30px,$color:black){@extend.base-shape;width:0;height:0;@if$direction==down{border-left:$size/2solidtransparent;border-right:$size/2solidtransparent;border-top:$sizesolid$color;border-bottom:0;}@elseif$direction==right{border-top:$size/2solidtransparent;border-bottom:$size/2solidtransparent;border-left:$sizesolid$color;border-right:0;}@elseif$direction==left{border-top:$size/2solidtransparent;border-bottom:$size/2solidtransparent;border-right:$sizesolid$color;border-left:0;}@elseif$direction==up{border-left:$size/2solidtransparent;border-right:$size/2solidtransparent;border-bottom:$sizesolid$color;border-top:0;}}