Split umbrellas.html into desktop and mobile view

Because the difference is friggin massive

4 files changed, 145 insertions, 113 deletions

diff --git a/jimbrella/templates/admin/umbrellas.html b/jimbrella/templates/admin/umbrellas.html
index 3a1455e..09b329a 100644
--- a/jimbrella/templates/admin/umbrellas.html
+++ b/jimbrella/templates/admin/umbrellas.html
@@ -23,119 +23,7 @@
         <h1>All Umbrellas</h1>
         <div id="container">
             {% include "admin/tabs.html" %}
-            {% if mobile %}
-            <div class="data-table-container">
-                <table class="data">
-                    {% for umb in umbrellas %}
-                    {% if umb.serial == edit %}
-                    <form method="post" action="/admin/umbrellas/edit">
-                        <input name="serial" type="number" value="{{ umb.serial }}" hidden />
-                        <tr id="{{ umb.serial }}" class="{{ umb.status }}">
-                            <th rowspan=5>
-                                {{ umb.serial }} <br />
-                                {{ status_dropdown(umb) }} <br />
-                                <input type="submit" value="Submit" />
-                            </th>
-                            <td><input name="tenant_name" value="{{ umb.tenant_name }}" /></td>
-                        </tr>
-                        <tr class="{{ umb.status }}">
-                            <td><input name="tenant_id" type="number" value="{{ umb.tenant_id }}" /></td>
-                        </tr>
-                        <tr class="{{ umb.status }}">
-                            <td><input name="tenant_phone" type="tel" value="{{ umb.tenant_phone }}" /></td>
-                        </tr>
-                        <tr class="{{ umb.status }}">
-                            <td><input name="lent_at" type="datetime-local" value="{{ umb.lent_at_str }}" /></td>
-                        </tr>
-                        <tr class="{{ umb.status }}"><td>
-                            {{ umb.lent_time_ago_str }}
-                            {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
-                        </td></tr>
-                    </form>
-                    {% else %}
-                    {# not edit mode #}
-                    {% if umb.status in ["lent", "overdue"] %}
-                    <tr id="{{ umb.serial }}" class="{{ umb.status }}">
-                            <th rowspan=5>
-                                {{ umb.serial }} <br />
-                                {{ umb.status }} <br />
-                                <a href="/admin/umbrellas?edit={{ umb.serial }}">Edit</a>
-                            </th>
-                            <td>{{ umb.tenant_name }}</td>
-                        </tr>
-                        <tr class="{{ umb.status }}"><td>{{ umb.tenant_id }}</td></tr>
-                        <tr class="{{ umb.status }}"><td>{{ umb.tenant_phone }}</td></tr>
-                        <tr class="{{ umb.status }}"><td>{{ umb.lent_at_str }}</td></tr>
-                        <tr class="{{ umb.status }}"><td>
-                            {{ umb.lent_time_ago_str }}
-                            {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
-                        </td></tr>
-                    {% else %}
-                    <tr id="{{ umb.serial }}" class="{{ umb.status }}">
-                            <th colspan=2>
-                                {{ umb.serial }} <br />
-                                {{ umb.status }} <br />
-                                <a href="/admin/umbrellas?edit={{ umb.serial }}#{{ umb.serial }}">Edit</a>
-                            </th>
-                        </tr>
-                    {% endif %}
-                    {% endif %}
-                    {% endfor %}
-                </table>
-            </div>
-            {% else %}
-            {# not mobile #}
-            <div class="data-table-container">
-                <table class="data">
-                    <thead>
-                        <tr>
-                            <th>#</th>
-                            <th>Status</th>
-                            <th>Tenant</th>
-                            <th>ID</th>
-                            <th>Phone</th>
-                            <th colspan=2>Lent at</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for umb in umbrellas %}
-                        <tr id="{{ umb.serial }}" class="{{ umb.status }}">
-                        {% if umb.serial == edit %}
-                        <form method="post" action="/admin/umbrellas/edit">
-                            <input name="serial" type="number" value="{{ umb.serial }}" hidden/>
-                            <td>{{ umb.serial }}</td>
-                            <td>{{ status_dropdown(umb) }}</td>
-                            <td><input name="tenant_name" value="{{ umb.tenant_name }}" class="db-edit" /></td>
-                            <td><input name="tenant_id" type="number" value="{{ umb.tenant_id }}" class="db-edit" /></td>
-                            <td><input name="tenant_phone" type="tel" value="{{ umb.tenant_phone }}" class="db-edit" /></td>
-                            <td><input name="lent_at" type="datetime-local" value="{{ umb.lent_at_str }}"/></td>
-                            <td>{{ umb.lent_time_ago_str }}
-                                {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
-                            </td>
-                            <td>
-                                <input type="submit" value="Submit" />
-                            </td>
-                        </form>
-                        {% else %}
-                            <td>{{ umb.serial }}</td>
-                            <td>{{ umb.status }}</td>
-                            <td>{{ umb.tenant_name }}</td>
-                            <td>{{ umb.tenant_id }}</td>
-                            <td>{{ umb.tenant_phone }}</td>
-                            <td>{{ umb.lent_at_str }}</td>
-                            <td>{{ umb.lent_time_ago_str }}
-                                {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
-                            </td>
-                            <td>
-                                <a href="/admin/umbrellas?edit={{ umb.serial }}#{{ umb.serial }}">Edit</a>
-                            </td>
-                        {% endif %}
-                        </tr>
-                        {% endfor %}
-                    </tbody>
-                </table>
-            </div>
-            {% endif %}
+            {% block table %}{% endblock %}
         </div>
     </body>
 </html>
diff --git a/jimbrella/templates/admin/umbrellas_desktop.html b/jimbrella/templates/admin/umbrellas_desktop.html
new file mode 100644
index 0000000..c8b0044
--- /dev/null
+++ b/jimbrella/templates/admin/umbrellas_desktop.html
@@ -0,0 +1,53 @@
+{% extends "admin/umbrellas.html" %}
+{% block table %}
+<div class="data-table-container">
+    <table class="data">
+        <thead>
+            <tr>
+                <th>#</th>
+                <th>Status</th>
+                <th>Tenant</th>
+                <th>ID</th>
+                <th>Phone</th>
+                <th colspan=2>Lent at</th>
+            </tr>
+        </thead>
+        <tbody>
+            {% for umb in umbrellas %}
+            <tr id="{{ umb.serial }}" class="{{ umb.status }}">
+            {% if umb.serial == edit %}
+            <form method="post" action="/admin/umbrellas/edit">
+                <input name="serial" type="number" value="{{ umb.serial }}" hidden/>
+                <td>{{ umb.serial }}</td>
+                <td>{{ status_dropdown(umb) }}</td>
+                <td><input name="tenant_name" value="{{ umb.tenant_name }}" class="db-edit" /></td>
+                <td><input name="tenant_id" type="number" value="{{ umb.tenant_id }}" class="db-edit" /></td>
+                <td><input name="tenant_phone" type="tel" value="{{ umb.tenant_phone }}" class="db-edit" /></td>
+                <td><input name="lent_at" type="datetime-local" value="{{ umb.lent_at_str }}"/></td>
+                <td>{{ umb.lent_time_ago_str }}
+                    {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
+                </td>
+                <td>
+                    <input type="submit" value="Submit" />
+                </td>
+            </form>
+            {% else %}
+                <td>{{ umb.serial }}</td>
+                <td>{{ umb.status }}</td>
+                <td>{{ umb.tenant_name }}</td>
+                <td>{{ umb.tenant_id }}</td>
+                <td>{{ umb.tenant_phone }}</td>
+                <td>{{ umb.lent_at_str }}</td>
+                <td>{{ umb.lent_time_ago_str }}
+                    {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
+                </td>
+                <td>
+                    <a href="/admin/umbrellas?edit={{ umb.serial }}#{{ umb.serial }}">Edit</a>
+                </td>
+            {% endif %}
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+</div>
+{% endblock %}
diff --git a/jimbrella/templates/admin/umbrellas_mobile.html b/jimbrella/templates/admin/umbrellas_mobile.html
new file mode 100644
index 0000000..3c63418
--- /dev/null
+++ b/jimbrella/templates/admin/umbrellas_mobile.html
@@ -0,0 +1,62 @@
+{% extends "admin/umbrellas.html" %}
+{% block table %}
+<div class="data-table-container">
+    <table class="data">
+        {% for umb in umbrellas %}
+        {% if umb.serial == edit %}
+        <form method="post" action="/admin/umbrellas/edit">
+            <input name="serial" type="number" value="{{ umb.serial }}" hidden />
+            <tr id="{{ umb.serial }}" class="{{ umb.status }}">
+                <th rowspan=5>
+                    {{ umb.serial }} <br />
+                    {{ status_dropdown(umb) }} <br />
+                    <input type="submit" value="Submit" />
+                </th>
+                <td><input name="tenant_name" value="{{ umb.tenant_name }}" /></td>
+            </tr>
+            <tr class="{{ umb.status }}">
+                <td><input name="tenant_id" type="number" value="{{ umb.tenant_id }}" /></td>
+            </tr>
+            <tr class="{{ umb.status }}">
+                <td><input name="tenant_phone" type="tel" value="{{ umb.tenant_phone }}" /></td>
+            </tr>
+            <tr class="{{ umb.status }}">
+                <td><input name="lent_at" type="datetime-local" value="{{ umb.lent_at_str }}" /></td>
+            </tr>
+            <tr class="{{ umb.status }}"><td>
+                {{ umb.lent_time_ago_str }}
+                {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
+            </td></tr>
+        </form>
+        {% else %}
+        {# not edit mode #}
+        {% if umb.status in ["lent", "overdue"] %}
+        <tr id="{{ umb.serial }}" class="{{ umb.status }}">
+                <th rowspan=5>
+                    {{ umb.serial }} <br />
+                    {{ umb.status }} <br />
+                    <a href="/admin/umbrellas?edit={{ umb.serial }}">Edit</a>
+                </th>
+                <td>{{ umb.tenant_name }}</td>
+            </tr>
+            <tr class="{{ umb.status }}"><td>{{ umb.tenant_id }}</td></tr>
+            <tr class="{{ umb.status }}"><td>{{ umb.tenant_phone }}</td></tr>
+            <tr class="{{ umb.status }}"><td>{{ umb.lent_at_str }}</td></tr>
+            <tr class="{{ umb.status }}"><td>
+                {{ umb.lent_time_ago_str }}
+                {% if umb.status in ["lent", "overdue"] %} ago {% endif %}
+            </td></tr>
+        {% else %}
+        <tr id="{{ umb.serial }}" class="{{ umb.status }}">
+                <th colspan=2>
+                    {{ umb.serial }} <br />
+                    {{ umb.status }} <br />
+                    <a href="/admin/umbrellas?edit={{ umb.serial }}#{{ umb.serial }}">Edit</a>
+                </th>
+            </tr>
+        {% endif %}
+        {% endif %}
+        {% endfor %}
+    </table>
+</div>
+{% endblock %}
diff --git a/jimbrella/templates/auth.html b/jimbrella/templates/auth.html
new file mode 100644
index 0000000..9fb1e14
--- /dev/null
+++ b/jimbrella/templates/auth.html
@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>JI Umbrella</title>
+        <link rel="stylesheet" href="/static/jimbrella.css" />
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+    </head>
+    <body>
+        {% if action == "login" %}
+        <h1>Login to JI Umbrella</h1>
+        {% else %}
+        <h1>Register for JI Umbrella</h1>
+        {% endif %}
+
+        <div id="container">
+            {% include "admin/tabs.html" %}
+            <div class="banner-container">
+            {% if error %}
+                <div class="banner error">{{ error }}</div>
+            {% endif %}
+                <form method="post" action="/{{ action }}">
+                    <input name="username" placeholder="Username" /> <br />
+                    <input name="password" type="password" placeholder="Password" /> <br />
+                    <input type="submit" value="{{ action|capitalize }}" />
+                </form>
+            </div>
+        </div>
+    </body>
+</html>