Use templating properly

schleising · Dec 30, 2022 · b195a5e · b195a5e
1 parent 6536ef2
commit b195a5e
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 5 deletions.
diff --git a/website/index.py b/website/index.py
@@ -9,4 +9,4 @@
 @app.get("/", response_class=HTMLResponse)
 async def root(request: Request):
     print('Hello')
-    return TEMPLATES.TemplateResponse('base.html', {'request': request})
+    return TEMPLATES.TemplateResponse('index.html', {'request': request})
diff --git a/website/static/images/Screenshot.png b/website/static/images/Screenshot.png
diff --git a/website/templates/base.html b/website/templates/base.html
@@ -1,8 +1,34 @@
 <!DOCTYPE html>
-<html>
-  <head>
-  </head>
+<html lang="en">
+
+<head>
+    {% block title %}<title>Home</title>{% endblock %}
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css"
+        integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
+
+    <link href="/icons/favicon.ico" rel="icon" type="image/ico" />
+
+    {% block head %}
+    {% endblock %}
+
+</head>
   <body>
-    Hello
+    {% block content %}
+    {% endblock %}
+
+    <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
+        integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
+        crossorigin="anonymous"></script>
+    <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"
+        integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo"
+        crossorigin="anonymous"></script>
+    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"
+        integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI"
+        crossorigin="anonymous"></script>
+
+    {% block scripts %}
+    {% endblock %}
   </body>
 </html>
diff --git a/website/templates/index.html b/website/templates/index.html
@@ -0,0 +1,6 @@
+{% extends "base.html" %}
+
+{% block content %}
+<h1>Hello from Index.html</h1>
+<img src="/images/Screenshot.png">
+{% endblock %}