Для чего вы используете SASS?

Для улучшения организации, читаемости и поддерживаемости CSS-кода. Основные причины:

• Переменные: Позволяют хранить значения (цвета, шрифты, размеры) в одном месте и повторно использовать.
• Вложенность: Позволяет структурировать CSS-правила, имитируя структуру DOM.
• Миксины: Позволяют повторно использовать блоки CSS-кода.
• Функции: Позволяют выполнять сложные вычисления и операции со значениями.
• Импорт (@import): Позволяет разделять код на мелкие, управляемые файлы.
• Условные операторы и циклы: Позволяют создавать более гибкие и динамичные стили.

Пример использования переменных:

$primary-color: #007bff;

body {
  color: $primary-color;
}

Пример использования вложенности:

nav {
  ul {
    margin: 0;
    padding: 0;
    list-style: none;

    li {
      display: inline-block;
    }
  }
}

Пример использования миксина:

@mixin border-radius($radius) {
  -webkit-border-radius: $radius;
     -moz-border-radius: $radius;
      -ms-border-radius: $radius;
          border-radius: $radius;
}

.box {
  @include border-radius(10px);
}