refactor: moving to my own template, using fomantic instead of uikit. removing uikit, and some other removed stuff

2024-01-15 21:55:28 +01:00
parent b5f9be7e5a
commit 8b42c94aa6
29 changed files with 564 additions and 37519 deletions
@@ -0,0 +1,161 @@
+<!DOCTYPE html>
+{% set is_nav_sidebar_enabled = true %}
+<html lang="{{ language_code|none('en-us') }}" dir="{{ LANGUAGE_BIDI|yesno('rtl,ltr,auto') }}">
+
+<head>
+  <title>{% block title %}{{ title|none('Admiral') }}{% endblock %}</title>
+
+
+  <!-- You MUST include jQuery 3.4+ before Fomantic -->
+  <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.min.js"></script>
+  <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/fomantic-ui@2.9.3/dist/semantic.min.css">
+  <script src="https://cdn.jsdelivr.net/npm/fomantic-ui@2.9.3/dist/semantic.min.js"></script>
+
+  <link rel="stylesheet" type="text/css" href="/static/admin/admin.css">
+
+  {% block dark_mode_vars %}<!-- would contain css for dark mode in django. -->{% endblock %}
+  {% block extrastyle %}{% endblock %}
+  {% block extrahead %}{% endblock %}
+
+  {% block responsive %}
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  {% endblock %}
+
+  {% block blockbots %}
+  <meta name="robots" content="NONE,NOARCHIVE">
+  {% endblock %}
+</head>
+
+<body>
+  {% block body %}
+
+  {% block header %}
+  <header id="header" class="ui small inverted top fixed main menu">
+    <a class="launch icon item">
+      <i class="content icon"></i>
+    </a>
+
+    <div class="item active" id="branding">
+      {% block branding %}Miniweb{% endblock %}
+    </div>
+
+    {% block usertools %}
+    {% endblock usertools %}
+
+    <div class="right menu">
+      <div class="item">
+        <a class="ui blue image label">
+          <img src="/images/avatar/small/person.jpg">
+          Person
+          <div class="detail">Admin</div>
+        </a>
+      </div>
+
+      <div class="icon item">
+        <i class="power icon" style="float: none;"></i>
+      </div>
+    </div>
+
+  </header>
+  {% endblock %}
+
+  {% block sidebar %}
+  <div class="ui vertical sidebar left visible overlay" id="main_sidemenu">
+    <div class="ui vertical inverted fluid menu">
+      <div class="item"><a href="{{admin_url}}">
+          <i class="big d20 dice icon" style="float: none;"></i>
+          <b>Administration</b>
+        </a>
+      </div>
+
+      <div class="item">
+        <div class="ui hidden right aligned search input" id="search">
+          <div class="ui inverted transparent icon input">
+            <input class="prompt" type="text" placeholder="Filter...">
+            <i class="search link icon" data-content="Search UI"></i>
+          </div>
+          <div class="results"></div>
+        </div>
+      </div>
+
+      <div class="item">
+        <div class="header">General</div>
+        <div class="menu">
+
+          <a class="item" href="#">
+            Introduction
+          </a>
+
+          <a class="item" href="#">
+            Status
+          </a>
+
+          <a class="item" href="#">
+            Settings
+          </a>
+
+        </div>
+      </div>
+
+      {% if available_apps %}
+      {% for app in available_apps %}
+      <div class="item">
+        <i class="cog link icon" href="{{ app.admin_url }}"></i>
+        <div class="header">{{ app.name }} </div>
+        <div class="menu">
+          {% for model in app.models %}
+          <div
+            class="item model-{{ model.key }}{% if model.admin_url in request.path|urlencode %} current-model{% endif %}">
+            {% if model.admin_url %}
+            <a href="{{ model.admin_url }}" {% if model.admin_url in request.path|urlencode %} aria-current="page" {%
+              endif %}>{{ model.name }}</a>
+            {% else %}
+            {{ model.name }}
+            {% endif %}
+
+            <i class="plus link icon"></i>
+            {% if model.add_url %}
+            <a href="{{ model.add_url }}" class="addlink">{{ translate( 'Add') }}</a>
+            {% endif %}
+            {% endfor %}
+            </table>
+          </div>
+        </div>
+      </div>
+      {% endfor %}
+      {% endif %}
+
+    </div>
+  </div>
+  {% endblock sidebar %}
+
+  <div class="pusher pushover" id="main_content">
+    <main>
+      {% block content %}
+      {% endblock content %}
+    </main>
+  </div>
+
+  {% endblock body %}
+  {% block bodyjs %}
+  <script src="/static/htmx/htmx.min.js"></script>
+  <script type="text/javascript">
+    $(document).ready(function () {
+      $('#main_sidemenu').sidebar({
+        transition: 'overlay',
+        dimPage: false,
+        closable: false,
+        onHide: function () {
+          $('#main_content').removeClass('pushover');
+        },
+        onShow: function () {
+          // This function is called when the sidebar is visible
+          $('#main_content').addClass('pushover');
+        }
+      }).sidebar('attach events', '.launch.icon.item').sidebar("show");
+    });
+  </script>
+  {% endblock bodyjs %}
+</body>
+
+</html>