<html xmlns:f="http://typo3.org/ns/TYPO3/CMS/Fluid/ViewHelpers" data-namespace-typo3-fluid="true">

<nav class="navbar navbar-main navbar-expand-lg py-0 pt-lg-4">
    <div class="container">
        <div class="collapse navbar-collapse justify-content-end position-relative z-2">
            <ul class="navbar-nav flex-grow-1">
                <li class="nav-item nav-item--home">
                    <f:link.page pageUid="{rootPage}" class="nav-link nav-link--logo" title="{settings.logo.linktitle}" additionalAttributes="{role:'menuitem'}">
                        <img src="{f:uri.image(src: settings.logo.file-white)}" alt="{settings.logo.alt}" height="{settings.logo.height}" width="{settings.logo.width}">
                    </f:link.page>
                </li>
                <f:for each="{nav}" as="navItem">
                    <li class="nav-item{f:if(condition: navItem.data.alias, then:' nav-item--{v:format.sanitizeString(string: navItem.data.alias)}')}{f:if(condition: navItem.children, then: ' parent')} flex-grow-1">
                        <a href="{navItem.link}" class="nav-link text-center text-uppercase text-nowrap{f:if(condition: navItem.active, then: ' active')}{f:if(condition: navItem.current, then: ' current')}" data-uid="{navItem.data.uid}"{f:if(condition: navItem.current, then: ' aria-current="page"')}>{navItem.title -> f:format.htmlentitiesDecode()}</a>
                    </li>
                </f:for>
            </ul>
        </div>
    </div>
</nav>
