Add notifications to navbar

scipost/static/scipost/assets/css/_navbar.scss

@@ -73,3 +73,13 @@
         white-space: nowrap;
     }
 }
+
+.navbar-counter {
+    position: relative;
+
+    .badge {
+        position: absolute;
+        right: -3px;
+        top: 2px;
+    }
+}

scipost/templates/scipost/bare_base.html

@@ -21,6 +21,8 @@
     <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css">
     <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
 
+    <script src="https://use.fontawesome.com/1f60a2fe64.js"></script><!-- Temporary -->
+
     {% block headsup %}
     {% endblock headsup %}
   </head>

scipost/templates/scipost/navbar.html

@@ -22,7 +22,13 @@
 
           {% if user.is_authenticated %}
               <li class="nav-item highlighted">
-                <span class="nav-link">Logged in as {{ user.username }}</span>
+                <div class="d-s nav-link">
+                    Logged in as {{ user.username }}
+                    <a class="d-inline nav-link navbar-counter" href="{% url 'notifications:all' %}">
+                        <i class="fa fa-bell-o" aria-hidden="true"></i>
+                        <span class="badge badge-pill badge-primary">2</span>
+                    </a>
+                </div>
               </li>
               {% if perms.scipost.can_oversee_refereeing %}
                   <li class="nav-item{% if '/submissions/admin' in request.path %} active{% endif %}">