Add a skip link for keyboard users

Someone might use it...

RIGS/static/scss/screen.scss

@@ -78,6 +78,22 @@ ins {
   color: $gray-400 !important;
 }
 
+.skip-link {
+  background: $info;
+  color: $white;
+  outline: unset;
+  height: 30px;
+  left: 50%;
+  padding: 8px;
+  position: absolute;
+  transform: translateY(-100%);
+  transition: transform 0.3s;
+}
+
+.skip-link:focus {
+  transform: translateY(0%);
+}
+
 html.embedded {
   display: flex;
   flex-direction: column;

RIGS/templates/base_rigs.html

@@ -0,0 +1,122 @@
+{% extends 'base.html' %}
+
+{% load static %}
+
+{% block titleheader %}
+<a class="navbar-brand" href="/">RIGS</a>
+{% endblock %}
+
+{% block titleelements %}
+{% if user.is_authenticated %}
+    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+    <li class="nav-item dropdown">
+      <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownRigboard" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        Rigboard
+      </a>
+      <div class="dropdown-menu" aria-labelledby="navbarDropdownRigboard">
+        <a class="dropdown-item" href="{% url 'rigboard' %}"><span class="fas fa-list"></span>
+                            Rigboard</a>
+        <a class="dropdown-item" href="{% url 'event_archive' %}"><span class="fas fa-book"></span>
+                            Archive</a>
+        <a class="dropdown-item" href="{% url 'web_calendar' %}"><span class="fas fa-calendar"></span>
+                            Calendar</a>
+        {% if perms.RIGS.view_event %}
+        <a class="dropdown-item" href="{% url 'activity_table' %}"><span
+                                    class="fas fa-random"></span> Recent Changes</a>
+        {% endif %}
+        {% if perms.RIGS.add_event %}
+        <a class="dropdown-item" href="{% url 'event_create' %}"><span class="fas fa-plus"></span>
+                                New Event</a>
+        {% endif %}
+       </div>
+    </li>
+    {% if perms.RIGS.view_invoice %}
+    <li class="nav-item dropdown">
+      <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownInvoices" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+        Invoices
+      </a>
+      <div class="dropdown-menu" aria-labelledby="navbarDropdownInvoices">
+        {% if perms.RIGS.add_invoice %}
+        <a class="dropdown-item" href="{% url 'invoice_waiting' %}"><span class="fas fa-briefcase text-danger"></span> Waiting</a>
+        {% endif %}
+        <a class="dropdown-item" href="{% url 'invoice_list' %}"><span class="fas fa-pound-sign text-warning"></span> Outstanding</a>
+        <a class="dropdown-item" href="{% url 'invoice_archive' %}"><span class="fas fa-book"></span> Archive</a>
+      </div>
+    </li>
+    {% endif %}
+    {% if perms.RIGS.view_person %}
+    <li class="nav-item"><a class="nav-link" href="{% url 'person_list' %}">People</a></li>
+    {% endif %}
+    {% if perms.RIGS.view_organisation %}
+    <li class="nav-item"><a class="nav-link" href="{% url 'organisation_list' %}">Organisations</a></li>
+    {% endif %}
+    {% if perms.RIGS.view_venue %}
+    <li class="nav-item"><a class="nav-link" href="{% url 'venue_list' %}">Venues</a></li>
+    {% endif %}
+    <form id="searchForm" class="form-inline flex-nowrap mx-3" role="form" method="GET">
+        <div class="input-group input-group-sm flex-nowrap">
+            <div class="input-group-prepend">
+                <input id="id_search_input" type="search" name="q" class="form-control form-control-sm" placeholder="Search..." />
+            </div>
+            <select id="search-options" class="custom-select form-control">
+              <option selected data-action="{% url 'event_archive' %}" href="#">Events</option>
+              <option data-action="{% url 'person_list' %}" href="#">People</option>
+              <option data-action="{% url 'organisation_list' %}" href="#">Organisations</option>
+              <option data-action="{% url 'venue_list' %}" href="#">Venues</option>
+              {% if perms.RIGS.view_invoice %}
+              <option data-action="{% url 'invoice_archive' %}" href="#">Invoices</option>
+              {% endif %}
+            </select>
+        </div>
+        <button class="btn btn-primary form-control form-control-sm btn-sm">Search</button>
+        <a href="{% url 'search_help' %}" class="nav-link modal-href btn-sm"><span class="fas fa-question-circle"></span></a>
+    </form>
+{% endif %}
+<li class="nav-item dropdown" id="user">
+    {% if user.is_authenticated %}
+        <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+            Hi {{ user.first_name }}
+        </a>
+        <ul class="dropdown-menu p-3" id="userdropdown">
+                <li class="media">
+                    <a href="{% url 'profile_detail' %}">
+                        <img src="{{ request.user.profile_picture }}" class="media-object"/>
+                        <div class="media-body">
+                            <b>{{ request.user.first_name }} {{ request.user.last_name }}</b>
+                            <p class="muted">{{ request.user.email }}</p>
+                        </div>
+                    </a>
+                </li>
+                <li>
+                <a href="{% url 'logout' %}" class="btn btn-primary align"><i class="fas fa-sign-out-alt"></i> Logout</a>
+                </li>
+            </ul>
+    {% else %}
+        <a class="nav-link" href="{% url 'login' %}">
+            Login
+        </a>
+    {% endif %}
+</li>
+{% endblock %}
+{% block js %}
+<script src="{% static 'js/tooltip.js' %}"></script>
+<script src="{% static 'js/popover.js' %}"></script>
+<script>
+    $(function () {
+          $('[data-toggle="tooltip"]').tooltip();
+    })
+</script>
+<script>
+    $(document).ready(function(){
+        $('#search-options option').click(function(){
+            $('#searchForm').attr('action', $(this).data('action')).submit();
+        });
+        $('#id_search_input').keypress(function (e) {
+          if (e.which == 13) {
+            $('#searchForm').attr('action', $('#search-options option').first().data('action')).submit();
+            return false;
+          }
+        });
+    });
+</script>
+{% endblock %}

RIGS/templates/event_form.html

@@ -92,8 +92,8 @@
                   .attr({type : 'text/css', rel : 'stylesheet'})
                   .attr('href', '{% static "css/bootstrap-datetimepicker.min.css" %}');
                 $.when(
-                    $.getScript( "{% static "js/moment.min.js" %}" ),
-                    $.getScript( "{% static "js/bootstrap-datetimepicker.min.js" %}" ),
+                    $.getScript( "{% static "js/moment.js" %}" ),
+                    $.getScript( "{% static "js/bootstrap-datetimepicker.js" %}" ),
                     $.Deferred(function( deferred ){
                         $( deferred.resolve );
                     })