O framework Sass Compass fornece uma função útil para obter a direção oposta de uma posição, por exemplo, leftao passar rightcomo argumento.
Esta função não só não precisa do Compass, mas também aceita uma lista de posições em vez de uma única. Ele também lida com valor inválido normalmente. Nada além do melhor!
/// 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; )Uso:
.selector ( background-position: opposite-direction(top right); )Resultado:
.selector ( background-position: bottom left; )