Highlight unread notifications

fedireads/static/format.css

@@ -221,3 +221,7 @@ th, td {
 .post.depth-4 {
     margin-left: 3em;
 }
+
+.unread {
+    background-color: #F3FFBD;
+}

fedireads/templates/notifications.html

@@ -9,7 +9,7 @@
             <button type="submit">Delete notifications</button>
         </form>
         {% for notification in notifications %}
-        <div class="notification{% if not notification.read %}unread{% endif %}">
+        <div class="notification{% if notification.id in unread %} unread{% endif %}">
             <p>
             {% if notification.notification_type == 'FAVORITE' %}
                 {% include 'snippets/username.html' with user=notification.related_user %}

fedireads/views.py

@@ -139,12 +139,15 @@ def register(request):
     return redirect('/')
 
 
+@login_required
 def notifications_page(request):
     ''' list notitications '''
     notifications = request.user.notification_set.all() \
             .order_by('-created_date')
+    unread = [n.id for n in notifications.filter(read=False)]
     data = {
         'notifications': notifications,
+        'unread': unread,
     }
     notifications.update(read=True)
     return TemplateResponse(request, 'notifications.html', data)