<!doctype html>
<html lang="{{ site.Language }}">
    {{ partial "head.html" . }}
    <body>
        <aside>
            <header>
                <a href="/"><img src="{{ printf "/static/img/logo_%s.svg" .Site.Language.Lang | absURL }}" alt="data coop logo" width="240" height="140"></a>

                <div class="nav-toggle" id="nav-toggle-header">
                    <span id="nav-toggle-a"></span> 
                    <span id="nav-toggle-b"></span> 
                    <span id="nav-toggle-c"></span> 
                </div>
            </header>
            {{ partial "nav.html" . }}
            <footer>
                {{ partial "footer.html" . }}
            </footer>
        </aside>
        <main>
            <article>
                {{ block "main" . }}{{ end }}
            </article>
        </main>
        <script>
            var menu = document.getElementById("nav-toggle-header");
            var nav = document.getElementsByTagName('aside')[0];

            function toggleMenu() {
                if ( menu.classList.contains("display") ) {
                    menu.classList.remove("display");
                    nav.classList.remove("display");
                } else {
                    menu.classList.add("display");
                    nav.classList.add("display");
                }
            }

            menu.addEventListener("click", toggleMenu);
        </script>
    </body>
</html>