Данный блок описывает один уровень меню.
Разметка.
Элементы.
menu-node - узел меню, в него вкладываются ссылки, другие уровни меню, прочее.
menu-link - ссылка
menu-marker - вспомогательный элемент, различные иконки
menu-toggler - переключатель, отвечающий за показ следующего уровня по нажатию.
Модификаторы.
.menu--vertical - выстраивает узлы меню в вертикаль
.menu--horizontal - выстраивает узлы меню в горизонтальное меню
.menu--dropdown - делает из данного блока выпадающее меню, выставляет правильный z-index
.menu--side - делает из данного блока выпадающее меню "в сторону", выставляет правильный z-index.
.menu--fixed - делает из данного блока фиксированный уровень меню position:fixed, выставляет правильный z-index.
.menu--collapse - указывает, что данный блок сколлапсирован, display: none
Рекомендации.
Для стилизации различных уровней меню рекомендуется добавлять пользовательские модификаторы на узел меню .menu-node и через них описывать стили стили вложенных элементов.
Вспомогательный JS.
Для построения сворачивающегося меню используйте следующие вспомогательные классы
.js-menu-wrapper - указывает контейнер меню
.js-menu-toggler - указывает переключатель
Так же существует вспомогательный плагин collapseMeu, отвечающий за преобразование меню в свернутое меню с переключателем при изменении ширины окна браузера меньше 800px.
