adding triangle mixin

opentech/static_src/src/sass/apply/abstracts/_mixins.scss

@@ -126,3 +126,29 @@
 
     font-size: $responsive;
 }
+
+// Triangle mixin
+// @param {Direction} $direction - Triangle direction, either `top`, `right`, `bottom` or `left`
+// @param {Color} $color [currentcolor] - Triangle color
+// @param {Length} $size [1em] - Triangle size
+@mixin triangle($direction, $color: currentcolor, $size: 1em) {
+    @if not index(top right bottom left, $direction) {
+        @error 'Direction must be either `top`, `right`, `bottom` or `left`.';
+    }
+
+    width: 0;
+    height: 0;
+    content: '';
+    border-#{opposite-direction($direction)}: ($size * 1.5) solid $color;
+
+    $perpendicular-borders: $size solid transparent;
+
+    @if $direction == top or $direction == bottom {
+        border-right:  $perpendicular-borders;
+        border-left:   $perpendicular-borders;
+    } @else if $direction == right or $direction == left {
+        border-top:    $perpendicular-borders;
+        border-bottom: $perpendicular-borders;
+    }
+  }
+