Skip to content

Instantly share code, notes, and snippets.

@KittyGiraudel
Created April 18, 2014 10:03
Show Gist options
  • Save KittyGiraudel/11035501 to your computer and use it in GitHub Desktop.
Save KittyGiraudel/11035501 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
// ----
// Sass (v3.3.5)
// Compass (v1.0.0.alpha.18)
// ----
// Returns opposite direction
// Quite similar to the one from Compass
// Rely on Sass 3.3 but could easily be adapted to Sass 3.2
// ---
// @param [list] $directions: list of directions
// ---
// @return opposite directions
@function opposite-direction($directions) {
$opposite-directions: ();
$direction-map: (
'top': 'bottom',
'right': 'left',
'bottom': 'top',
'left': 'right',
'ltr': 'rtl',
'rtl': 'ltr'
);
// Loop through each value in $directions
// 1. Get opposite from map
// 2. If direction exists, append it to result list
// 3. Or warn the user
@each $direction in $directions {
$opposite-direction: map-get($direction-map, $direction); // 1
@if $opposite-direction != null {
$opposite-directions: append($opposite-directions, #{$opposite-direction}); // 2
}
@else {
@warn "No opposite direction can be found for `#{$direction}`."; // 3
}
}
@return if($opposite-directions != (), $opposite-directions, false);
}
// Test
test {
$directions:
left, right, top, bottom,
top left, top right, bottom left, bottom right,
left top, right top, left bottom, right bottom,
ltr, rtl,
error;
@each $direction in $directions {
#{$direction}: opposite-direction($direction);
}
}
test {
left: right;
right: left;
top: bottom;
bottom: top;
top left: bottom right;
top right: bottom left;
bottom left: top right;
bottom right: top left;
left top: right bottom;
right top: left bottom;
left bottom: right top;
right bottom: left top;
ltr: rtl;
rtl: ltr;
error: false;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment