Textarea

Стандартный textarea

<form class="form">
  <div class="form__row">
    <label for="">Сообщение</label>
    <textarea class="textarea" placeholder="Текс сообщения"></textarea>
    <div class="error-text">Сообщение об ошибки</div>
  </div>
</div>

Textarea с ошибкой

<form class="form">
  <div class="form__row error">
    <label for="">Сообщение</label>
    <textarea class="textarea" placeholder="Текс сообщения"></textarea>
    <div class="error-text">Сообщение об ошибки</div>
  </div>
</div>

Модификаторы

--sizing - автоматически изменяет размер в соответствии с ее содержимым.

Настройки

$line-height - интервал между строк; $min-height - минимальная высота

Вызов

  .textarea {
    @include field-sizing; // дефолт: (line-height: 1.5), (min-height: 3lh)
    @include field-sizing(2,8); // свои значения
  }

Демонстрация