$direction: ltr !default; $direction-values: ( ltr: rtl, rtl: ltr, left: right, right: left ) !default; @function direction($value) { @if $direction == rtl and map-has-key($direction-values, $value) { @return map-get($direction-values, $value); } @return $value; } @function direction-sides($values) { @if $direction == rtl and length($values) == 4 { @return nth($values, 1) nth($values, 4) nth($values, 3) nth($values, 2); } @return $values; } @function direction-corners($values) { @if $direction == rtl and length($values) > 1 { @if length($values) == 2 { @return nth($values, 2) nth($values, 1); } @else if length($values) == 3 { @return nth($values, 2) nth($values, 1) nth($values, 2) nth($values, 3); } @else { @return nth($values, 2) nth($values, 1) nth($values, 4) nth($values, 3); } } @return $values; } @function direction-if($condition, $if, $else: null) { @return if($direction == $condition, $if, $else); } @function direction-ltr($if, $else: null) { @return direction-if(ltr, $if, $else); } @function direction-rtl($if, $else: null) { @return direction-if(rtl, $if, $else); } @mixin direction { direction: $direction; } @mixin direction-if($condition) { @if $direction == $condition { @content; } } @mixin direction-ltr { @include direction-if(ltr) { @content; } } @mixin direction-rtl { @include direction-if(rtl) { @content; } }