71 lines
2.1 KiB
Twig
71 lines
2.1 KiB
Twig
{% set logged_in = true %}
|
|
<button
|
|
id="burger-menu__button-open"
|
|
type="button"
|
|
data-drawer-target="burger-menu"
|
|
data-drawer-show="burger-menu"
|
|
data-drawer-placement="right"
|
|
aria-controls="burger-menu"
|
|
>
|
|
<twig:ux:icon name="ph:list" />
|
|
</button>
|
|
<div
|
|
id="burger-menu"
|
|
class="transition-transform translate-x-full"
|
|
tabindex="-1"
|
|
>
|
|
<button
|
|
type="button"
|
|
id="burger-menu__button-close"
|
|
data-drawer-hide="burger-menu"
|
|
aria-controls="burger-menu"
|
|
>
|
|
<twig:ux:icon name="ph:x" />
|
|
</button>
|
|
<div id="burger-menu__user-section">
|
|
<div id="burger-menu__user-picture-wrapper">
|
|
<twig:ux:icon name="ph:user-circle-fill" />
|
|
</div>
|
|
{% if logged_in %}
|
|
<span id="burger-menu__user-name">Username</span>
|
|
<span id="burger-menu__user-email">username@email.com</span>
|
|
<div id="burger-menu__user-actions">
|
|
{{ _self.user_action('Profile', 'user-fill') }}
|
|
{{ _self.user_action('Settings', 'gear-fill') }}
|
|
{{ _self.user_action('Logout', 'sign-out') }}
|
|
</div>
|
|
{% else %}
|
|
<span id="burger-menu__user-info">not logged in</span>
|
|
{% endif %}
|
|
</div>
|
|
{% if not logged_in %}
|
|
<hr/>
|
|
<a id="burger-menu__login">
|
|
<span>Login with Euphcloud</span>
|
|
</a>
|
|
{% endif %}
|
|
<hr/>
|
|
<nav id="burger-menu__nav">
|
|
<ul id="burger-menu__nav-list">
|
|
{{ _self.nav_item('Test1', '#test1', 'list') }}
|
|
{{ _self.nav_item('Test2', '#test2', 'list') }}
|
|
{{ _self.nav_item('Test3', '#test3', 'list') }}
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
|
|
{% macro user_action(name, icon) %}
|
|
<button>
|
|
<twig:ux:icon name="ph:{{ icon }}" />
|
|
<span>{{ name }}</span>
|
|
</button>
|
|
{% endmacro %}
|
|
|
|
{% macro nav_item(name, href, icon) %}
|
|
<li id="burger-menu__nav-item">
|
|
<a id="burger-menu__nav-link" href="{{ href }}">
|
|
<twig:ux:icon name="ph:{{ icon }}" />
|
|
<span class="flex-1">{{ name }}</span>
|
|
</a>
|
|
</li>
|
|
{% endmacro %}
|