WIP: Implement menu/navigation

templates/layout.html.twig

@@ -1,11 +1,32 @@
 {% extends 'base.html.twig' %}
 
 {% block body %}
-    {% block page_header %}{% include '_partials/_page_header.html.twig' %}{% endblock %}
-    <div class="container py-24">
-        {% block content %}{% endblock %}
+    <div class="container grid md:grid-cols-4 gap-8 py-8">
+        <div class="md:col-span-4">
+            <img class="h-8 w-auto" src="{{ asset('build/images/logo.svg') }}" alt="My E&amp;P Team">
+        </div>
+        {% include '_partials/_sidebar_menu.html.twig' %}
+        <div class="md:col-span-3">
+            {% block content %}{% endblock %}
+        </div>
     </div>
     {% include '_partials/_ajax_modal.html.twig' %}
     {% include '_partials/_confirmation_modal.html.twig' %}
-    {% include '_partials/_mobile_menu.html.twig' %}
+    <div id="mobilenav"
+         class="fixed z-50 top-0 left-0 inset-0 pr-16 bg-black/70 -translate-x-full"
+            {{ stimulus_controller('mobilenav', [], { 'closed': '-translate-x-full' }, { 'mobilenav': '#mobilenav' }) }}
+    >
+        <div class="h-screen w-full bg-white">
+            <div class="flex justify-between px-8 pt-4">
+                <img src="{{ asset('build/images/logo.svg') }}" alt="" class="block w-auto h-8">
+                <button type="button"
+                        {{ stimulus_action('mobilenav', 'trigger', null, { 'mode': 'close' }) }}>
+                    {{ icon('close', 'w-8 h-8') }}
+                </button>
+            </div>
+            <div class="w-full h-full p-8 pt-4 overflow-y-scroll">
+                {% block mobile_menu %}{% endblock %}
+            </div>
+        </div>
+    </div>
 {% endblock %}