Initial commit

core/templates/wm/magnet.html

@@ -0,0 +1,8 @@
+<magnet-block attract-distance="10" align-to="outer|center" class="floating-window">
+  {% extends 'wm/panel.html' %}
+  {% block heading %}
+  {% endblock %}
+
+  {% block panel_content %}
+  {% endblock %}
+</magnet-block>

core/templates/wm/modal.html

@@ -0,0 +1,19 @@
+{% load static %}
+
+<script src="{% static 'modal.js' %}"></script>
+{% block scripts %}
+{% endblock %}
+
+{% block styles %}
+{% endblock %}
+
+<div id="modal" class="modal is-active is-clipped">
+  <div class="modal-background"></div>
+  <div class="modal-content">
+    <div class="box">
+      {% block modal_content %}
+      {% endblock %}
+      <button class="modal-close is-large" aria-label="close"></button>
+    </div>
+  </div>
+</div>

core/templates/wm/panel.html

@@ -0,0 +1,19 @@
+
+<nav class="panel">
+  <p class="panel-heading" style="padding: .2em; line-height: .5em;">
+    <i class="fa-solid fa-arrows-up-down-left-right has-text-grey-light"></i>
+    {% block close_button %}
+      <i
+        class="fa-solid fa-xmark has-text-grey-light float-right"
+        data-script="on click remove the closest <nav/>"></i>
+    {% endblock %}
+    {% block heading %}
+    {% endblock %}
+  </p>
+  <article class="panel-block is-active">
+    <div class="control">
+      {% block panel_content %}
+      {% endblock %}
+    </div>
+  </article>
+</nav>

core/templates/wm/widget.html

@@ -0,0 +1,37 @@
+<div id="widget">
+  <div id="widget-{{ unique }}" class="grid-stack-item" {% block widget_options %}{% endblock %}>
+    <div class="grid-stack-item-content">
+
+      <nav class="panel">
+        <p class="panel-heading" style="padding: .2em; line-height: .5em;">
+          <i class="fa-solid fa-arrows-up-down-left-right has-text-grey-light"></i>
+          {% block close_button %}
+            <i
+              class="fa-solid fa-xmark has-text-grey-light float-right"
+              onclick='grid.removeWidget("widget-{{ unique }}");'></i>
+          {% endblock %}
+          <i
+            class="fa-solid fa-arrows-minimize has-text-grey-light float-right"
+            onclick='grid.compact();'></i>
+          {% block heading %}
+          {% endblock %}
+        </p>
+        <article class="panel-block is-active">
+          <div class="control">
+            {% block panel_content %}
+            {% endblock %}
+          </div>
+        </article>
+      </nav>
+    </div>
+  </div>
+</div>
+
+<script>
+  {% block custom_script %}
+  {% endblock %}
+  var widget_event = new Event('load-widget');
+  document.dispatchEvent(widget_event);
+</script>
+{% block custom_end %}
+{% endblock %}