Миксины

Использование миксинов

Используйте миксины для упрощения определений стилей и избегайте повторяющегося кода. Миксины могут быть созданы для общих шаблонов, обеспечивая подход DRY (Don't Repeat Yourself) в ваших стилях. Вот пример использования Scss:

@mixin body-1 {
  font-size: 18px;
  line-height: 36px;
}

@mixin body-2 {
  font-size: 16px;
  line-height: 32px;
}

@mixin H3 {
  font-size: 30px;
  line-height: 40px;

  @media (min-width: 768px) {
    font-size: 40px;
    line-height: 50px;
  }
}

@mixin flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}

.container {
  @include flex-center;
}