✨ add new base template for fullscreen apps

CodeWithAloha · Nov 12, 2024 · 27bd570 · 27bd570
1 parent af3a742
commit 27bd570
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 23 deletions.
diff --git a/froide/templates/base.html b/froide/templates/base.html
@@ -3,28 +3,30 @@
 {% load static %}
 {% load frontendbuild %}
 {% block body_tag %}
-    {% if request.user.is_authenticated and request.session.impostor %}
-        {% include "account/includes/impostor.html" %}
-    {% endif %}
-    {% block top_block %}{% endblock %}
-    {% block navbar %}
-        {% include "header.html" %}
-    {% endblock %}
-    {% include "snippets/breadcrumbs.html" %}
-    {% block body_wrapper %}
-        <main class="main">
-            {% block index_banner %}{% endblock %}
-            {% block foisite_advice %}{% endblock %}
-            {% block messages %}
-                {% include "snippets/messages.html" %}
-            {% endblock messages %}
-            {% block body %}
-                <div class="container mb-5 mt-3">
-                    {% block app_body %}{% endblock %}
-                </div>
-            {% endblock %}
-        </main>
-    {% endblock %}
+    {% block above_footer %}
+        {% if request.user.is_authenticated and request.session.impostor %}
+            {% include "account/includes/impostor.html" %}
+        {% endif %}
+        {% block top_block %}{% endblock %}
+        {% block navbar %}
+            {% include "header.html" %}
+        {% endblock %}
+        {% include "snippets/breadcrumbs.html" %}
+        {% block body_wrapper %}
+            <main class="main">
+                {% block index_banner %}{% endblock %}
+                {% block foisite_advice %}{% endblock %}
+                {% block messages %}
+                    {% include "snippets/messages.html" %}
+                {% endblock messages %}
+                {% block body %}
+                    <div class="container mb-5 mt-3">
+                        {% block app_body %}{% endblock %}
+                    </div>
+                {% endblock %}
+            </main>
+        {% endblock %}
+    {% endblock above_footer %}
     {% block footer_container %}
         {% include "footer.html" %}
     {% endblock %}

diff --git a/froide/templates/fullscreen_app.html b/froide/templates/fullscreen_app.html
@@ -0,0 +1,4 @@
+{% extends "base.html" %}
+{% block above_footer %}
+    <div class="body-content">{{ block.super }}</div>
+{% endblock above_footer %}
diff --git a/frontend/styles/components/base.scss b/frontend/styles/components/base.scss
@@ -1,4 +1,5 @@
-body {
+body,
+.body-content {
   display: flex;
   min-height: 100vh;
   flex-direction: column;
@@ -18,6 +19,8 @@ small,
 }
 
 .main {
+  display: flex;
+  flex-direction: column;
   flex: 1 0 auto;
 }