Прочитал про бем, попробовал его 2 раза при верстке сайтов, понравилось. На тостере задавался уже вопрос такой же, но я все равно не могу понять, что делать если у меня 3 уровня вложенности.
Вот пример (буду писать на jade)
.contatcs
.left-side
.title
.accordion
ul
.right-side
Я для каждой страницы создаю отдельный блок в котором уже все остальное размещаю. В общем специфическая обертка для отделение страниц по верстке друг от друга. Чтоб я сам понимал, что на странице contacts.html есть блок в котором контакты. Кстати если есть замечания по этому поводу, скажите пожалуйста, мне кажется, что это не правильно)
В общем есть у меня блок contacts в нем есть 2 блока левый и правый, в левом блоке есть элемент заголовок и много аккордеонов внутри которых свои элементы. По своей логике я и пытаясь придерживаться bem я называю их так.
.contacts
.contacts__left-side
contacts__left-side_title? contacts__left-side__title?
.accordion
.accordion__elem
.accordion__elem2
.contacts__right-side
И вот тут вопрос, как правильно назвать элемент title? Если у бем правило блок - элемент - модификатор.
Блок контакты будут только на странице контакты, блок контакты__левая-сторона только в блоке контакты (и обычная grid разметка к нему применяться не будет) в блоке контакты__левая-сторона у меня есть элемент title и аккордеон (который в свою очередь тоже блок). Это я расписал, чтоб показать, как я это вижу. Так как же правильно мне все это называть?
Или может использовать каскад в данном случае? И сделать элемент title который будет только в contacts__left-side ???
.contacts__left-side title {
css
}