Допустим у меня вот такая вёрстка header'а
<header class="page__header header">
<nav class="header__nav nav">
<ul class="nav__links">
<li class="nav__item">
<a href="#" class="nav__link"></a>
</li>
</ul>
</nav>
</header>
Как мне это разбить на блоки header, nav и их элементы?
Использую handlebars. Если я напишу шаблон для блока header, будет вот так, верно?
<header class="page__header header">
{{>nav/nav.hbs}}
</header>
Начав писать шаблон, я столкнулся с проблемой, во первых - создавая новый блок, который входит в другой блок, как мне реализовать миксы - внешнюю геометрию и позиционирование как я могу писать класс header__nav, если nav допустим не всегда используется как элемент header'а?
В итоге получается примерно вот так. Получается что каждая html вложенность это импорт, это нормально? Я только начинаю знакомиться с методологией и шаблонизаторами
index.hbs
<body class="page">
{{>header/header.hbs}}
{{>article/article.hbs}}
{{>footer/footer.hbs}}
</body>
header.hbs
<header class="page__header header">
{{>nav/nav.hbs}}
</header>
nav.hbs // вот именно здесь главный вопрос с классом header__nav, куда мне его девать если nav не должен быть зависим от header'a?
<nav class="??header__nav?? nav">
{{>nav/__links/nav__links.hbs}}
</nav>
nav__links.hbs
<ul class="nav__links">
{{#each nav__links}}
{{>nav/__item/nav__item.hbs}}
{{/each}}
</ul>
nav__item.hbs
<li class="nav__item">
{{>nav/__link/nav__link.hbs}}
</li>
nav__link.hbs
<a href="#{{this.link}}" class="nav__link">{{this.text}}</a>
На вход я подаю вот по типу таких данных например, типовая навигация для лендинга:
nav__links: [
{ link: "about", text: "about us" },
{ link: "prices", text: "pricelist" },
{ link: "team", text: "our team" },
{ link: "contact", text: "contact us" },
]
По файловой структуре получается вот так:
Выглядит довольно запутанно и неявно, иерархию не видно сразу.
Заодно вопрос, обязательно ли в каждую сущность/модификатор добавлять все файлы технологий?
Чаще всего модификатор изменяет только стили например, нужно ли добавлять пустой файл шаблона и скриптов? Или например если я пока что только верстальщик и поведение описываю редко.
