Tutorial by Examples

!!! Container should be positioned relatively or absolutely $direction - top, bottom, left, right $margin - margin by the edge in $direction. For top and bottom direction - it's from left to right. For left and right - it's from top to bottom. $colors - first is a border color, second - is a back...

$color-purple-bg: #AF6EC4; $color-purple-border: #5D0C66; $color-yellow-bg: #E8CB48; $color-yellow-border: #757526; .tooltip { position: relative; &--arrow-down { @include pointer('bottom', 30px, ($color-purple-border, $color-purple-bg), 15px); } ...