Template refactors

En iets met de playlist-maker. URLs opnieuw ingedeeld.

playlist/templates/Base.html

@@ -19,7 +19,7 @@
         </div>
       </div>
       <div class="window-body">
-        <menu role="tablist" hx-boost="true">
+        <menu role="tablist" hx-boost="true" class="multirows">
           <li role="tab" {% if request.path == '/vote/' %}aria-selected="true" {% endif %}>
             <a href="{% url 'vote' %}">Stemmen</a>
           </li>
@@ -33,8 +33,37 @@
             <a href="{% url 'settings' %}">Instellingen</a>
           </li>
         </menu>
+        {% block multi-row %}{% endblock %}
         <div class="window" role="tabpanel">
           <div class="window-body">
+            {% if message_type %}
+              <script>
+                function hidePopup() {
+                  document.getElementById("info-window").classList.add("hide");
+                }
+              </script>
+              <div class="window popup" id="info-window">
+                <div class="title-bar">
+                  <div class="title-bar-text">
+                    {% if message_title %}{{message_title}}{% else %}{{message_type | title}}{% endif %}
+                  </div>
+                  <div class="title-bar-controls">
+                      <button aria-label="Close" onclick="hidePopup()"></button>
+                  </div>
+                </div>
+                <div class="window-body">
+                  <div class="icon {{message_type}}"></div>
+                  <div class="text">
+                      <div>
+                        {{message}}
+                      </div>
+                      <section class="field-row" style="justify-content: flex-end">
+                          <button onclick="hidePopup()">Ok</button>
+                      </section>
+                  </div>
+                </div>
+              </div>
+            {% endif %}
             {% block main-content %}{% endblock %}
           </div>
         </div>