XFiesta/templates/inbox.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
40
41
42
43
44
45
46
47
48
49
50
51
52
{% extends "layout.html" %}

{% block optional_c %}
    <link rel="stylesheet" href="/static/styles/inbox.css">
{% endblock %}

{% block title %}
    Inbox
{% endblock %}

{% block main %}
    <div class="container-main">
        <div class="bar">
            <div class="logo" style="width: 100%;">
                <img src="/static/images/inbox.png" alt="inbox-logo" width="40px">
                <div class="logo-text" style="margin-left: 10px;">Inbox</div>
            </div>
        </div>
        <div class="o-profile" style="margin-top: 2rem;">
            {% if inbox %}
                {% for chat in inbox %}
                    <div id="{{ chat['user_id'] }}" class="chat-box">
                        <div class="person-info">
                            <a href="/profile/{{ chat['username'] }}"><div class="profile-pic" style="width: 2.5rem; height: 2.5rem;"><img src="{% if chat['pfp_location'] %} /{{ chat['pfp_location'] }} {% else %} /static/images/user_profile_pic.png {% endif %}"></div></a>
                            <div style="margin-left: 0.5vw; text-align: left;">
                                <div class="name"><a href="/profile/{{ chat['username'] }}" style="text-decoration: none; color: inherit;">{{ chat['fullname'] }}</a></div>
                                <div class="username"><a href="/profile/{{ chat['username'] }}" style="text-decoration: none; color: inherit;">@{{ chat['username'] }}</a></div>
                            </div>
                        </div>
                        <div class="bottom-part">
                            <span><strong>Messages Exchanged:</strong> {{ chat["messages"] }}</span>
                            {% if chat["last_message"] %}
                                <span><strong> Most Recent:</strong> {{ chat["last_message"] }}</span>
                            {% endif %}
                        </div>
                        <div class="actions">
                            <div class="action-button">
                                <a href="/inbox/{{ chat['user_id'] }}"><button class="action-button" type="button"><img alt="chat" src="/static/images/comments.png"></button></a>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            {% else %}
                <div style="padding: 1rem;">
                    You don't seem to have any chats open yet.
                    <br>
                    <a href="/friends">Start chatting with your friends!</a>
                </div>
            {% endif %}
        </div>
    </div>
{% endblock %}