{% load wagtailcore_tags my my_amp %}

{% if request.user_agent.is_mobile %}
        <div class="theme-{{ page.theme }}">
        {% if amp %}<amp-sidebar id="sidebar1" layout="nodisplay" side="right">{% endif %}
            <aside id="aside-mobile" class="large">
                <div class="aside-mobile-header">
                    <p class="aside-mobile-title">Navigation</p>
                    <div {% if amp %}tabindex="1" role="menu" on="tap:sidebar1.close"{% endif %} id="aside-mobile-close" class="s-cursor">
                        {% amp_img %}
                            <img class="s-icon x1 nopad"
                                 src="{{ icons.cross|ico:page.theme }}"
                                 alt="aside-mobile"/>
                        {% endamp_img %}
                    </div>
                </div>
                <div class="aside-mobile-nav">
                    {% include 'cms/blocks/common/nav/nav_header.html' with menus=page.navigation.header_menus %}
                </div>

                {% comment %}<div class="aside-mobile-footer">
                    <div class="btn-container s-center">
                        {% for button in page.navigation.header_buttons %}
                            {% include_block button %}
                        {% endfor %}
                    </div>
                </div>{% endcomment %}
            </aside>
        {% if amp %}</amp-sidebar>{% endif %}
        </div>
{% endif %}
