Layout tweeks

app/interface/templates/base.html

@@ -9,18 +9,22 @@
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bulma@0.9.3/css/bulma.min.css">
     <link rel="stylesheet" href="{% static 'interface/css/polyphonic.css' %}"></link>
     <script src="{% static 'interface/js/interface.js' %}"></script>
+    <script src="//unpkg.com/alpinejs" defer></script>
+    <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js" defer></script>
+    <script src="//kit.fontawesome.com/c837098e5b.js" crossorigin="anonymous" defer></script>
     <title>{% block title %}Polyphonic{% endblock %}</title>
     {% block media %}{% endblock %}
     <style>{% block style %}{% endblock %}</style>
   </head>
+  
   <body>
 
   {% block navigation %}
   <nav class="navbar" role="navigation">
     <div class="navbar-brand has-text-primary">
       <a class="navbar-item" href="/">
-        <span class="icon fancy is-size-2 mx-4"><i class="fas fa-random"></i></span>
-        <span class="fancy is-size-2">Polyphonic</span>
+        <span class="icon fancy is-size-2 imx-4"><i class="fas fa-random"></i></span>
+        <span class="fancy is-size-2 is-size-4-touch">Polyphonic</span>
       </a>
       <span class="navbar-item is-hidden-mobile fancy is-size-5">Musical Ensemble Manager</span>
 
@@ -35,7 +39,7 @@
     <div id="navbarMain" class="navbar-menu">
 
       <div class="navbar-end">
-        <span class="navbar-item is-size-4">{% firstof ensemble project.ensemble %}</span>
+        <span class="navbar-item is-size-5-touch is-size-4-tablet">{% firstof ensemble project.ensemble %}</span>
       </div>
 
     </div>
@@ -48,8 +52,6 @@
 {% endblock %}
 
   <!-- late load scripts -->
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
-  <script src="https://kit.fontawesome.com/c837098e5b.js" crossorigin="anonymous"></script>
   {% block scripts %}
   {% endblock %} 
   </body>

app/interface/templates/interface/project_base.html

@@ -76,7 +76,7 @@
         </div>
 
         {% endif %}
-        <section class="section">
+        <div class="block" style="margin: auto 2em">
             {% if request.is_admin %}
             <div class="admin-tools is-pulled-right">
             {% block admin %}
@@ -87,7 +87,7 @@
             {% block page %}
             No content
             {% endblock %}
-        </section>
+        </div>
     </div>
 </div>