@if - les conditions

Sass vous permet d'utiliser des conditions avec if/else.

Exemple :

$text-color: #444;
$shadow-opacity: .1;

.cool-area {
  // If the text is dark, we put a white shadow
  @if lightness($text-color) < 50% {
    text-shadow: 1px 1px 1px rgba(#fff, $shadow-opacity);
  } @else {
    // Otherwise, it's that the text is clear, we put a black shadow
    text-shadow: 1px 1px 1px rgba(#000, $shadow-opacity);
  }

  color: $text-color;
}