Типовой breadcrumbs - nunjucks, scss, модель данных

breadcrumbs.txt

<nav class="breadcrumbs">
    <div class="container">
        <ul class="breadcrumbs__list">
            {% for item in BREADCRUMBS_DATA %}
                <li class="breadcrumbs__item">
                    {% if loop.last %}
                        <span>{{ item.text }}</span>
                    {% else %}
                        <a href="{{ item.url }}">{{ item.text }}</a>
                    {% endif %}
                </li>
            {% endfor %}
        </ul>
    </div>
</nav>



.breadcrumbs {
    padding: 15px 0 12px;
    border-top: 1px solid $c-gray;
    border-bottom: 1px solid $c-gray;
}

.breadcrumbs__list {
    @include list-reset();
}

.breadcrumbs__item {
    display: inline-block;
    font-size: 16px;

    &:not(:last-of-type) {
        &:after {
            content: "/";
            padding: 0 5px;
        }
    }

    a {
        text-decoration: none;

        &:hover {
            color: $c-gray;
        }
    }

    span {
        color: $c-gray;
    }
}



{% set BREADCRUMBS_DATA = [
    {url: "/", text: "Главная"}, 
    {text: "Контакты"}
] %}