{% extends "djangocms_frontend.html" %}{% load cms_tags menu_tags %}
{% block base_css %}
    <link href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
{% endblock %}
{% block base_js %}
    <script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.js"></script>
{% endblock %}
{% block navbar %}
    <header class="mdc-top-app-bar mdc-top-app-bar--fixed">
        <div class="mdc-top-app-bar__row">
            <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
                <button class="material-icons mdc-top-app-bar__navigation-icon mdc-icon-button" aria-label="Open navigation menu">menu</button>
                <span class="mdc-top-app-bar__title">{% block site_title %}{% endblock %}</span>
            </section>
            <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end" role="toolbar">
                <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Favorite">favorite</button>
                <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Search">search</button>
                <button class="material-icons mdc-top-app-bar__action-item mdc-icon-button" aria-label="Options"><more_vertdd></more_vertdd></button>
            </section>
        </div>
    </header>
    <aside class="mdc-drawer" style="display: block;">
        <div class="mdc-drawer__content">
            <nav class="mdc-list">
                {% show_menu 0 100 0 100 'materialio/menu.html' %}
            </nav>
        </div>
    </aside>
    <div class="mdc-drawer-app-content">
        <p>test</p>
    </div>
    <script type="text/javascript">
        window.mdc.autoInit();
    </script>
{% endblock %}
