XFiesta/templates/notifications.html at main · sh4dman23/XFiesta · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
{% extends "layout.html" %}

{% block optional_c %}
    <link rel="stylesheet" href="/static/styles/notifications.css">
    <script src="/static/scripts/notifications.js"></script>
{% endblock %}

{% block title %}
    Notifications
{% endblock %}

{% block main %}
    <div class="container-main">
        <div class="bar">
            <div class="logo">
                <img src="/static/images/notifications.png" alt="notifications">
                <span class="logo-text">Notifications&nbsp;&nbsp;</span>
                <span id="unread_notification_count" class="logo-text">{{ unread_notification_count }}</span>
            </div>
            <div class="mark-all-as-read">
                <button class="btn btn-primary btn-prof" onclick="mark_all_as_read();">Mark All As Read</button>
            </div>
        </div>

        <div class="o-profile notifications">
            {% for notification in notifications %}
                <a style="width: 100%; text-decoration: none; color: inherit;" href="{{ notification['href'] }}" target="_blank">
                    <div id="{{ notification['id'] }}" class="notification {% if notification['status'] == 'unread' %} notification-unread {% endif %}" {% if notification["status"] == 'unread' %} onclick="mark_as_read({{ notification['id'] }});" {% endif %}>
                        <div>
                            <span class="details">{{ notification["details"] }}</span>
                            <br>
                            <span class="timestamp">{{ notification["time"] }} {{ notification["date"] }}</span>
                        </div>
                    </div>
                </a>
            {% endfor %}
        </div>
    </div>
{% endblock %}