<header class="header">
<button class="button header__auth">Войти</button>
<button class="button header__join">Зарегистрироваться</button>
</header>
text_color_white -> text_light
text_color_grey -> text_dim
Меня всё мучает один единственный вопрос, смысл бэма понятен.Точно понятен? Смысл как раз избегать дублей.
если элементы по свойствам одинаковые, но в разных блоках.То из этих элементов нужно сделать блок, будет примерно так:
<div class="block">
<div class="btn block__btn"></div>
<div class="text block__text"></div>
</div>
<div class="block1">
<div class="btn block1__btn"></div>
<div class="text block1__text"></div>
</div>
Стоит ли использовать такую структуру, если верстаешь один?Скорее нет, но это дело привычки и вкуса, в такой структуре нет ничего ужасного, зато ничего лишнего не будет.
Это как же нужно заставить gulp извращаться, чтобы собрать проект?Примерно вот так.
Использую gulp и бэм но папки для блоков приходится вручную создавать и подключать. Какое есть решени для того чтобы быстро создать блок с css и js файлом и папкой под изображения.
npm run add block
, а еще можно автоматически создавать блок в зависимости от HTML разметки. Можете глянуть эту сборку и выдернуть себе нужный функционал. <nav class="nav entry__nav">
<ul class="nav__items">
<li class="nav__item">
<a href="#" class="link nav__link">Меню 1</a>
</li>
<li class="nav__item">
<a href="#" class="link nav__link">Меню 2</a>
</li>
<li class="nav__item">
<a href="#" class="link nav__link">Меню 3</a>
</li>
</ul>
</nav>