Skip to content

Instantly share code, notes, and snippets.

@akrawchyk
Created September 27, 2013 19:45
Show Gist options
  • Save akrawchyk/6734181 to your computer and use it in GitHub Desktop.
Save akrawchyk/6734181 to your computer and use it in GitHub Desktop.
Reverses a CSS direction, accepting a single direction or a list.
.media {
@each $dir in left, right {
.pull-#{$dir} {
margin-#{opposite-direction($dir)}: $padding-base-horizontal;
}
}
}
@function get-opposite-direction($direction) {
$opposite-direction: center;
@if $direction == top {
$opposite-direction: bottom;
}
@if $direction == bottom {
$opposite-direction: top;
}
@if $direction == left {
$opposite-direction: right;
}
@if $direction == right {
$opposite-direction: left;
}
@return $opposite-direction;
}
@function opposite-direction($direction) {
$opposite-direction: null;
@if length($direction) == 1 {
$opposite-direction: get-opposite-direction($direction);
} @else {
@for $i from 1 through length($direction) {
$opposite-direction: append($opposite-direction, get-opposite-direction(nth($direction, $i)));
}
}
@return $opposite-direction;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment