<nav class="navbar clean bg-light fixed-top navbar-expand-lg navbar-light white scrolling-navbar">
        <a class="navbar-brand" href="/">
            <strong class="text-primary">{{ this.theme.data.site_brand ? this.theme.data.site_brand : 'HOME'}}</strong>
        </a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault" aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarsExampleDefault">
            {% if __SELF__.menuItems %}
            <ul class="navbar-nav mr-auto">
                {% partial __SELF__ ~ "::layouts/clean/items" items=__SELF__.menuItems %}
            </ul>
            {% endif %}

            {% partial "common/utility/search-form" %}

            {% component "localePicker" %}
        </div>
</nav>
