initial

src/flask/templates/base.html

@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+
+        <title>{% block title %} Let there Be Pool Data {% endblock %}</title>
+
+        {{ bootstrap.load_css() }}
+
+        <style>
+            body {
+                background: #e8f1f9;
+            }
+        </style>
+    </head>
+    <body>
+        <!-- this is a base template using Bootstrap-Flask
+       https://bootstrap-flask.readthedocs.io/ -->
+
+        {% block content %} {% endblock %}
+
+        <!-- you can delete the next line if you're not using any Bootstrap JS -->
+        {{ bootstrap.load_js() }}
+    </body>
+</html>

src/flask/templates/index.html

@@ -0,0 +1,37 @@
+{% extends 'base.html' %}
+{% from 'bootstrap5/form.html' import render_form %}
+
+{% block title %}
+Login to Pool Data Tracker
+{% endblock %}
+{% block content %}
+
+<!--
+	TIPS about using Bootstrap-Flask:
+	https://github.com/helloflask/bootstrap-flask
+	https://bootstrap-flask.readthedocs.io/
+-->
+
+<div class="log-form">
+  {% if try_again %}
+  <h4>Login Failed Please try Again</h4>
+  {% endif %}
+
+    <div class="container">
+        <div class="row">
+            <div class="col-md-10 col-lg-8 mx-lg-auto mx-md-auto">
+
+                <h1 class="pt-5 pb-2">WHOOOOOOO ARE YOU!</h1>
+
+                <p class="lead">If you know you know</p>
+
+                {{ render_form(form) }}
+
+                <p class="pt-5"><strong>{{ message }}</strong></p>
+
+            </div>
+        </div>
+    </div>
+</div><!--end log form -->
+
+{% endblock %}

src/flask/templates/updater.html

@@ -0,0 +1,64 @@
+{% extends 'base.html' %}
+{% from 'bootstrap5/form.html' import render_form %}
+
+{% block title %}
+    Data Input
+{% endblock %}
+{% block content %}
+<!--
+	TIPS about using Bootstrap-Flask:
+	https://github.com/helloflask/bootstrap-flask
+	https://bootstrap-flask.readthedocs.io/
+-->
+
+<div class="container">
+  <div class="row">
+    <div class="col-md-10 col-lg-8 mx-lg-auto mx-md-auto">
+
+        <h1 class="pt-5 pb-2">Input Data you want to store</h1>
+        {% if success %}
+            <h3 class="pt-3 pb02">Thank you {{ updater_name | safe }}, Data Updated Successfully</h1>
+        {% endif %}
+
+            <div class="row">
+                <div class="col-md-6">
+                <table border=0>
+                    <tr>
+                        <td>
+                            {{ render_form(form) }}
+                        </td>
+                        <!-- <td>
+                            <div class="container">
+                                <div class="col-md-10 col-lg-8 mx-lg-auto mx-md-auto">
+
+                                <table border = 0>
+                                    {% for row in list %}
+                                        <table border=0>
+                                        {% for key, value in row.items() %}
+                                        <tr>
+                                            <th> {{ key }} </th>
+                                            <td> {{ value }} </td>
+                                        </tr>
+                                        {% endfor %}
+                                        </table>
+                                    {% endfor %}
+                                </table>
+                                </div>
+                            </div>
+                        </td> -->
+                        <td>
+                            <div class="container">
+                                <div class= "col-xs-12 col-sm-12 col-md-12">
+                                    <iframe style="width: 100vw;height: 80vh;position: relative;" src="static/data_plot.html" frameborder="0" allowfullscreen>
+                                    </iframe>
+                                </div>
+                            </div>
+                        </td>
+                    </tr>
+                </table>
+            </div>
+        </div>
+    </div>
+  </div>
+</div>
+{% endblock %}