{# Main navigation #}

<ul class="uk-navbar-nav uk-flex-center {{ navClass }}">

<li{{ app.request.get('_route') == 'home' ? ' class="uk-active uk-disabled"' }}>

<a href="{{ path('home') }}" title="Home">

<div>

<span class="uk-text-uppercase"><span uk-icon="home"></span><br class="uk-hidden@m">&nbsp;Home</span>

<div class="uk-navbar-subtitle uk-visible@m"><small><span class="uk-visible@l">Be part of our </span>community</small></div>

</div>

</a>

</li>

<li{{ app.request.get('_route') == 'list_tricks' ? ' class="uk-active uk-disabled"' }}>

<a href="{{ path('list_tricks', {'page': 1}) }}" title="Tricks">

<div>

<span class="uk-text-uppercase"><span uk-icon="thumbnails"></span><br class="uk-hidden@m">&nbsp;Tricks</span>

<div class="uk-navbar-subtitle uk-visible@m"><small><span class="uk-visible@l">Look at </span>complete list</small></div>

</div>

</a>

</li>

<li{{ app.request.get('_route') == 'register' ? ' class="uk-active uk-disabled"' }}>

<a href="{{ path('register') }}" title="Register">

<div>

<span class="uk-text-uppercase"><span uk-icon="users"></span><br class="uk-hidden@m">&nbsp;Register</span>

<div class="uk-navbar-subtitle uk-visible@m"><small><span class="uk-visible@l">Create an </span>account</small></div>

</div>

</a>

</li>

{% if is_granted('ROLE_USER') == false %}

<li{{ app.request.get('_route') == 'connect' ? ' class="uk-active uk-disabled"' }}>

<a href="{{ path('connect') }}" title="Login">

<div>

<span class="uk-text-uppercase"><span uk-icon="sign-in"></span><br class="uk-hidden@m">&nbsp;Login</span>

<div class="uk-navbar-subtitle uk-visible@m"><small><span class="uk-visible@l">Contribute as a </span>member</small></div>

</div>

</a>

</li>

{% else %}

<li>

<a href="{{ logout_path('main') }}" title="Logout">

<div>

<span class="uk-text-uppercase"><span uk-icon="sign-out"></span><br class="uk-hidden@m">&nbsp;Logout</span>

<div class="uk-navbar-subtitle uk-visible@m"><small><span class="uk-visible@l">Disconnect </span>profile</small></div>

</div>

</a>

</li>

{% endif %}

{# User profile information #}

{% if app.user %}

<li class="st-background-blue">

<a class="uk-position-relative" href="{{ path('update_profile', { 'mainRoleLabel': app.user.mainRoleLabel|lower }) }}" title="{{ app.user.nickName|e('html_attr') }}'s Profile">

<div>

<span class="uk-text-break uk-text-uppercase">

{# This HTML content is safely escaped due to default html strategy #}

<small>{{ app.user.firstName~' '~app.user.familyName }} <br class="uk-hidden@m"><span uk-icon="user"></span></small>

</span>

<div class="uk-navbar-subtitle uk-text-right uk-visible@m">

<small>{{ app.user.mainRoleLabel }}</small>

</div>

</div>

<span class="uk-position-top-right" uk-icon="icon: refresh; ratio: 0.5"></span>

</a>

</li>

{% endif %}

</ul>