23Determining Conditions with @if

Similar to @each, there’s another feature called @if that allows us to write conditions in our Sass. This kind of feature is mostly useful when writing what we generally refer to as SassScript, writing reusable mixins and functions for Sass.

Oftentimes when writing a mixin that should be used across projects, we want to react to some variable that is passed in. For instance, if you had a mixin called width, you might want to do nothing if the first argument passed in is less than 0. There are lots of situations where we might want our mixins to act smart and react to the values that we pass in.

After the @if keyword, we can put a statement that will evaluate to true or false. For example, 20 > 10 would evaluate ...

Get Pragmatic Guide to Sass now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.