Feat: Multiplayer sessions added using CRUD database.

templates/components/common/buttons/_buttons_save_cancel.html

@@ -0,0 +1,58 @@
+{% if block_id == 'button_save' %}
+<button id="{{ model.ID_BUTTON_SAVE }}" type="button" class="{{ model.FLAG_SUBMIT }} {{ model.FLAG_SAVE }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Save</button>
+{% elif block_id == 'button_cancel' %}
+<button id="{{ model.ID_BUTTON_CANCEL }}" type="button" class="{{ model.FLAG_CANCEL }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Cancel</button>
+{% elif block_id == 'button_add' %}
+<button type="button" class="{{ model.FLAG_ACTIVE }} {{ model.FLAG_ADD }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">+</button>
+{% elif block_id == 'button_confirm' %}
+<button id="{{ model.ID_BUTTON_CONFIRM }}" type="button" class="{{ model.FLAG_SUBMIT }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Confirm</button>
+{% elif block_id == 'button_get_in_touch' %}
+<button class="{{ model.FLAG_NAV_CONTACT }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}" alt="Get in touch" aria-label="Get in touch">Get in touch</button>
+{% elif block_id == 'button_apply_filters' %}
+<button id="{{ model.ID_BUTTON_APPLY_FILTERS }}" type="button" class="{{ model.FLAG_SUBMIT }} {{ model.FLAG_BUTTON }} {{ model.FLAG_BUTTON_PRIMARY }}">Apply filters</button>
+{% elif block_id == 'button_clear_filters' %}
+{% elif block_id == 'buttons_table_default' %}
+<div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_SAVE }} {{ model.FLAG_CANCEL }} {{ model.FLAG_COLUMN }}">
+    <div class="{{ model.FLAG_ROW }}">
+        <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }}">
+            {% set block_id = 'button_apply_filters' %}
+            {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+        </div>
+        {#
+            <div class="{{ model.FLAG_CONTAINER_INPUT }} {{ model.FLAG_COLUMN }}">
+                {% set block_id = 'button_add' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+        #}
+        <div class="{{ model.FLAG_COLUMN }}">
+            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+                {% set block_id = 'button_save' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+            {#
+            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+                {% set block_id = 'button_cancel' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+            #}
+        </div>
+        <div class="{{ model.FLAG_COLUMN }}">
+            <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+                {% set block_id = 'button_cancel' %}
+                {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+            </div>
+        </div>
+    </div>
+</div>
+{% elif block_id == 'container_buttons_save_cancel' %}
+<div class="{{ model.FLAG_CONTAINER }} {{ model.FLAG_ROW }} {{ model.FLAG_SAVE }} {{ model.FLAG_CANCEL }}">
+    <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+        {% set block_id = 'button_save' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+    </div>
+    <div class="{{ model.FLAG_CONTAINER_INPUT }}">
+        {% set block_id = 'button_cancel' %}
+        {% include 'components/common/buttons/_buttons_save_cancel.html' %}
+    </div>
+</div>
+{% endif %}

templates/components/common/buttons/_icon_add.html

@@ -0,0 +1,17 @@
+
+{% if class_name is not defined %}
+    {% set class_name = '' %}
+{% endif %}
+
+{% if attribute_text is not defined %}
+    {% set attribute_text = '' %}
+{% endif %}
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"
+    class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_ADD }} {{ class_name }}"
+    {{ attribute_text }}
+    {{ model.ATTR_VALUE_CURRENT }}="false" {{ model.ATTR_VALUE_PREVIOUS }}="false"
+>
+    <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+    <path d="M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM232 344l0-64-64 0c-13.3 0-24-10.7-24-24s10.7-24 24-24l64 0 0-64c0-13.3 10.7-24 24-24s24 10.7 24 24l0 64 64 0c13.3 0 24 10.7 24 24s-10.7 24-24 24l-64 0 0 64c0 13.3-10.7 24-24 24s-24-10.7-24-24z"/>
+</svg>

templates/components/common/buttons/_icon_checkbox.html

@@ -0,0 +1,9 @@
+
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"
+    fill="{{ colour }}"
+    class="{{ model.FLAG_ICON }} {{ model.FLAG_CHECKBOX }} {{ class_name }}"
+>
+    <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+    <path d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-320c0-35.3-28.7-64-64-64L64 32zM337 209L209 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L303 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z"/>
+</svg>

templates/components/common/buttons/_icon_hamburger.html

@@ -0,0 +1,23 @@
+
+{% if colour is not defined %}
+    {% set colour = model.COLOUR_PRIMARY %}
+{% endif %}
+{% if background_colour is not defined %}
+    {% set background_colour = model.COLOUR_ACCENT %}
+{% endif %}
+{% if id is not defined %}
+    {% set id = model.ID_BUTTON_HAMBURGER %}
+{% endif %}
+
+<div class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_HAMBURGER }}"
+    id="{{ id }}"
+>
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"
+        fill="{{ colour }}"
+        class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_HAMBURGER }}"
+        style="background-color: {{ background_colour }};"
+    >
+        <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+        <path d="M0 96C0 78.3 14.3 64 32 64l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 128C14.3 128 0 113.7 0 96zM0 256c0-17.7 14.3-32 32-32l384 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 288c-17.7 0-32-14.3-32-32zM448 416c0 17.7-14.3 32-32 32L32 448c-17.7 0-32-14.3-32-32s14.3-32 32-32l384 0c17.7 0 32 14.3 32 32z"/>
+    </svg>
+</div>

templates/components/common/buttons/_icon_trash.html

@@ -0,0 +1,17 @@
+
+{% if class_name is not defined %}
+    {% set class_name = '' %}
+{% endif %}
+
+{% if attribute_text is not defined %}
+    {% set attribute_text = '' %}
+{% endif %}
+
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" 
+    class="{{ model.FLAG_BUTTON }} {{ model.FLAG_ICON }} {{ model.FLAG_DELETE }} {{ model.FLAG_ACTIVE }} {{ class_name }}"
+    {{ attribute_text }}
+    {{ model.ATTR_VALUE_CURRENT }}="true" {{ model.ATTR_VALUE_PREVIOUS }}="true"
+>
+    <!--!Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.-->
+    <path d="M135.2 17.7L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-7.2-14.3C307.4 6.8 296.3 0 284.2 0L163.8 0c-12.1 0-23.2 6.8-28.6 17.7zM416 128L32 128 53.2 467c1.6 25.3 22.6 45 47.9 45l245.8 0c25.3 0 46.3-19.7 47.9-45L416 128z"/>
+</svg>

templates/components/common/buttons/_slider_display_order.html

@@ -0,0 +1,13 @@
+{% if display_order is defined %}
+{# Fix this
+    <div class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" {{ model.ATTR_VALUE_CURRENT }}="{{ display_order }}" {{ model.ATTR_VALUE_PREVIOUS }}="{{ display_order }}">☰</div>
+#}
+<input type="number" class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" 
+{{ model.ATTR_VALUE_CURRENT }}="{{ display_order }}" {{ model.ATTR_VALUE_PREVIOUS }}="{{ display_order }}" value="{{ display_order }}">
+{% else %}
+<input type="number" class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" 
+{{ model.ATTR_VALUE_CURRENT }} {{ model.ATTR_VALUE_PREVIOUS }}>
+{#
+    <div class="{{ model.FLAG_SLIDER }} {{ model.FLAG_DISPLAY_ORDER }}" {{ model.ATTR_VALUE_CURRENT }} {{ model.ATTR_VALUE_PREVIOUS }}>☰</div>
+#}
+{% endif %}