Внедрение методология БЭМ (BEM)

Предварительное обсуждение найденных ошибок перед отправкой их авторам фреймворка, а также внесение новых предложений.
Ответить
w3lifer
Сообщения: 9
Зарегистрирован: 2016.07.12, 14:22
Контактная информация:

Внедрение методология БЭМ (BEM)

Сообщение w3lifer »

Доброго времени.
Предложение заменить повсеместные классы Bootstrap на BEM.

Пример

Код: Выделить всё

<ul class="pagination">
  <li class="prev disabled"><span>&laquo;</span></li>
  <li class="active"><a href="...">1</a></li>
  <li><a href="...">2</a></li>
  <li><a href="...">3</a></li>
  <li class="next"><a href="...">&raquo;</a></li>
</ul>

Код: Выделить всё

<ul class="pagination">
  <li class="pagination__item-prev pagination__item_disabled"><span>&laquo;</span></li>
  <li class="pagination__item_active"><a href="...">1</a></li>
  <li><a href="...">2</a></li>
  <li><a href="...">3</a></li>
  <li class="pagination__item-next"><a href="...">&raquo;</a></li>
</ul>
P. S. Только с некоторым улучшением: префиксом `bem` перед блоком ...

Код: Выделить всё

<ul class="bem-pagination">
  <li class="bem-pagination__item-prev bem-pagination__item_disabled"><span>&laquo;</span></li>
  <li class="bem-pagination__item_active"><a href="...">1</a></li>
  <li><a href="...">2</a></li>
  <li><a href="...">3</a></li>
  <li class="bem-pagination__item-next"><a href="...">&raquo;</a></li>
</ul>
Ещё пример:

Код: Выделить всё

<div id="w0" class="grid-view">
  <div class="summary">Showing <b>1-10</b> of <b>100</b> items.</div>
  <table class="table table-striped table-bordered">
    ...
  </table>
</div>

Код: Выделить всё

<div id="w0" class="bem-grid-view">
  <div class="bem-grid-view__summary">Showing <b>1-10</b> of <b>100</b> items.</div>
  <table class="bem-grid-view__table">
    ...
  </table>
</div>
chesar
Сообщения: 514
Зарегистрирован: 2013.04.10, 17:49

Re: Внедрение методология БЭМ (BEM)

Сообщение chesar »

w3lifer писал(а):Доброго времени.
Предложение заменить повсеместные классы Bootstrap на BEM.
1. Зачем?
2. Почему?
Бэм это не замена именования классов.
2017 на носу, краем глаза касаюсь фронтенда, но Бэм уже не актуален вроде как пару лет.
w3lifer
Сообщения: 9
Зарегистрирован: 2016.07.12, 14:22
Контактная информация:

Re: Внедрение методология БЭМ (BEM)

Сообщение w3lifer »

- Не все пользуются Bootstrap.
- Это конкретно --- Bootstrap и точка. BEM --- универсально.
- У Bootstrap нет конкретики: `disabled` --- сколько в проекте классов `disabled`. Нужно как-то извращаться: `.pagination .prev.disabled`; vs `pagination__item_disabled`.
- > Бэм это не замена именования классов.
Вроде ничего не мешает использовать его так.
Ответить