Navbar

author: user@node5.net <user@node5.net> 2025-12-09 21:45:39 +0100
committer: user@node5.net <user@node5.net> 2025-12-09 21:45:39 +0100
commit: 133e9fd4e4248de394c3a846fe15b271dbf7ac55 (patch)
tree: 8e1a47d4287ce6ff2027cc51210e68f5f7137e04 /web_interface
parent: a105c659388cede0ba5178c4f5e41200b5b31d55 (diff)
9 files changed, 119 insertions, 9 deletions
diff --git a/web_interface/drinks/templates/base.html b/web_interface/drinks/templates/base.html
index a9d792b..1702a0b 100644
--- a/web_interface/drinks/templates/base.html
+++ b/web_interface/drinks/templates/base.html
@@ -16,6 +16,47 @@
   </head>
   <body>
     <main class="responsive">
+
+      <header>
+        <nav>
+          {% if request.get_full_path != '/drinks/' %}
+          <button class="circle transparent">
+            <a href="/drinks"><i>home</i></a>
+          </button>
+          {% endif %}
+
+          {% block header %}
+          {% endblock %}
+
+          <button class="transparent square" data-ui="#nav-menu">
+            <i>menu</i>
+          </button>
+        </nav>
+      </header>
+
+      <dialog class="right" id="nav-menu">
+        <ul class="list">
+          <li class="wave round">
+            <a href="/drinks">
+              <i>Local_Bar</i>
+              <span class="max">Drinks</span>
+            </a>
+          </li>
+          <li class="wave round">
+            <a href="/admin">
+              <i>Person</i>
+              <span class="max">Admin</span>
+            </a>
+          </li>
+          <li class="wave round">
+            <a href="/motor-controls">
+              <i>Manufacturing</i>
+              <span>Motor control</span>
+            </a>
+          </li>
+        </ul>
+      </dialog>
+
       {% block content %}
       {% endblock %}
     </main>
diff --git a/web_interface/drinks/templates/drinks_overview.html b/web_interface/drinks/templates/drinks_overview.html
index 13c8e9d..1c4f631 100644
--- a/web_interface/drinks/templates/drinks_overview.html
+++ b/web_interface/drinks/templates/drinks_overview.html
@@ -1,14 +1,21 @@
 {% extends 'base.html' %}
-
-{% block content %}
-
-<div class="field label prefix border">
+{% block header %}
+<div class="field label prefix border max">
   <i>search</i>
   <input type="text" id="search-bar">
   <label>Search</label>
   <i class="front" style="visibility: hidden" id="search-clear" onclick="document.getElementById('search-bar').value = ''; Search('')">close</i>
 </div>
 
+<button class="transparent square" data-ui="#add-drink">
+  <i>add</i>
+</button>
+{% endblock %}
+
+{% block content %}
+
+<!-- Search -->
+
 <script>
   const searchBar = document.getElementById('search-bar');
 
@@ -39,6 +46,7 @@
 });
 </script>
 
+<!-- Drinks -->
 
 <div class="grid" id="drinks">
 
@@ -60,7 +68,7 @@
             {% if drink.author %}
             <button class="circle drink-author" style="background-color: hsl({{ drink.author.color }}deg 80% 40%);">
               {{ drink.author }}
-              <div class="tooltip max" style="width: fit-content">
+              <div class="tooltip max bottom" style="width: fit-content">
                 <b>Author</b>
                 <p>{{ drink.author.name }}</p>
               </div>
@@ -85,11 +93,41 @@
         </div>
       </div>
     </article>
-
   </div>
-
   {% endfor %}
-
 </div>
 
+<!-- Add drink modal -->
+
+<div class="overlay blur"></div>
+<dialog id="add-drink">
+  <h5>Add drink</h5>
+  <fieldset>
+    <legend>Fill all fields</legend>
+    <div class="row">
+      <div class="max">
+        <div class="field border label max">
+          <input>
+          <label>Input</label>
+        </div>
+      </div>
+      <div class="max">
+        <div class="field border label">
+          <select>
+            <option>Item 1</option>
+            <option>Item 2</option>
+            <option>Item 3</option>
+          </select>
+          <label>Select</label>
+        </div>
+      </div>
+    </div>
+  </fieldset>
+
+  <nav class="right-align no-space">
+    <button class="transparent link">Cancel</button>
+    <button class="transparent link">Confirm</button>
+  </nav>
+</dialog>
+
 {% endblock %}
diff --git a/web_interface/drinks_machine/settings.py b/web_interface/drinks_machine/settings.py
index aae7e99..3dd92fc 100644
--- a/web_interface/drinks_machine/settings.py
+++ b/web_interface/drinks_machine/settings.py
@@ -66,7 +66,8 @@ INSTALLED_APPS = [
     'django.contrib.messages',
     'django.contrib.staticfiles',
     'drinks',
-    'colorfield'
+    'colorfield',
+    'motor_controls',
 ]
 
 MIDDLEWARE = [
diff --git a/web_interface/drinks_machine/urls.py b/web_interface/drinks_machine/urls.py
index 3d5f05b..aaafc65 100644
--- a/web_interface/drinks_machine/urls.py
+++ b/web_interface/drinks_machine/urls.py
@@ -24,6 +24,7 @@ urlpatterns = [
     path('admin/', admin.site.urls),
     path("drinks/", include("drinks.urls")),
     path('', RedirectView.as_view(url='/drinks/', permanent=False), name='redirect'),
+    path("motor-controls/", include("motor_controls.urls")),
 ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) + \
     static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
 
diff --git a/web_interface/motor_controls/__init__.py b/web_interface/motor_controls/__init__.py
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/web_interface/motor_controls/__init__.py
diff --git a/web_interface/motor_controls/apps.py b/web_interface/motor_controls/apps.py
new file mode 100644
index 0000000..d6fd8de
--- /dev/null
+++ b/web_interface/motor_controls/apps.py
@@ -0,0 +1,5 @@
+from django.apps import AppConfig
+
+
+class MotorControls(AppConfig):
+    name = 'motor_controls'
diff --git a/web_interface/motor_controls/templates/motor-controls.html b/web_interface/motor_controls/templates/motor-controls.html
new file mode 100644
index 0000000..f1c29ab
--- /dev/null
+++ b/web_interface/motor_controls/templates/motor-controls.html
@@ -0,0 +1,10 @@
+{% extends 'base.html' %}
+{% block header %}
+<div class="max"></div>
+{% endblock %}
+
+{% block content %}
+
+🦗
+
+{% endblock %}
diff --git a/web_interface/motor_controls/urls.py b/web_interface/motor_controls/urls.py
new file mode 100644
index 0000000..acdb237
--- /dev/null
+++ b/web_interface/motor_controls/urls.py
@@ -0,0 +1,8 @@
+from django.urls import path
+
+from . import views
+
+urlpatterns = [
+    path("", views.index, name="index"),
+]
+
diff --git a/web_interface/motor_controls/views.py b/web_interface/motor_controls/views.py
new file mode 100644
index 0000000..ddb80db
--- /dev/null
+++ b/web_interface/motor_controls/views.py
@@ -0,0 +1,6 @@
+from django.shortcuts import render
+from django.http import HttpRequest, HttpResponse
+
+def index(request: HttpRequest) -> HttpResponse:
+    return render(request=request, template_name="motor-controls.html")
+
author	user@node5.net <user@node5.net>	2025-12-09 21:45:39 +0100
committer	user@node5.net <user@node5.net>	2025-12-09 21:45:39 +0100
commit	133e9fd4e4248de394c3a846fe15b271dbf7ac55 (patch)
tree	8e1a47d4287ce6ff2027cc51210e68f5f7137e04 /web_interface
parent	a105c659388cede0ba5178c4f5e41200b5b31d55 (diff)