Sass mixin with if else

Question

i have the following mixin

@mixin arrows($arrowdirection:\"left\", $arrowsize:\"5px\", $arrowcolor:$navbgblue ) {
            


        

Answer 1

here is working mixin with just 4 lines of code:

/*
 * Creates CSS triangle
 * direction options: top, right, bottom, left.
 * Example @include cssTriangle(bottom, red, 50px);
 */
@mixin cssTriangle($direction:left, $color:#89D4E7, $width:34px) {
    $opposite: nth((top,right,bottom,left), index((bottom,left,top,right),$direction));
    border: solid $width transparent;
    border-#{$direction}: none;
    border-#{$opposite}: solid $width $color;
}