привет, есть 2 кнопочки: одна обычный баттон, вторая - инпут внутри лейбла, но визуально это одинаковые блоки
проблема начинается тогда, когда необходимо отрисовать focus или disabled, т.к. в случае с баттоном все просто:
.button:disabled
, а для лейбла уже приходится делать что-то вроде
input:focus ~ .button__wrapper
как наиболее изящно описать все состояния, чтобы не дублировать код?
у меня пока 3 варианта и все очень не нравятся:
- создавать отдельный бэм блок под нужную структуру
-
@extend'ить стили .button
- все состояния записывать через миксины (пока самый адекватный вариант)