Sass ramverk Kompass ger en praktisk funktion för att få motsatt riktning för en position, till exempel leftvid passering rightsom argument.
Denna funktion behöver inte bara kompass utan den accepterar också en lista med positioner snarare än en enda. Det hanterar också ogiltigt värde elegant. Inget annat än det bästa!
/// Returns the opposite direction of each direction in a list /// @author Hugo Giraudel /// @param (List) $directions - List of initial directions /// @return (List) - List of opposite directions @function opposite-direction($directions) ( $opposite-directions: (); $direction-map: ( 'top': 'bottom', 'right': 'left', 'bottom': 'top', 'left': 'right', 'center': 'center', 'ltr': 'rtl', 'rtl': 'ltr' ); @each $direction in $directions ( $direction: to-lower-case($direction); @if map-has-key($direction-map, $direction) ( $opposite-directions: append($opposite-directions, unquote(map-get($direction-map, $direction))); ) @else ( @warn "No opposite direction can be found for `#($direction)`. Direction omitted."; ) ) @return $opposite-directions; )Användande:
.selector ( background-position: opposite-direction(top right); )Resultat:
.selector ( background-position: bottom left; )