Add more info popup

Display profile picture at better resolution
This commit is contained in:
Michał 2023-04-21 16:22:31 +00:00
parent 26d65811f1
commit 789441e636
2 changed files with 27 additions and 9 deletions

View file

@ -196,7 +196,7 @@
align-items: center
.banner-header
margin: 0.5rem 0
margin: 0.7rem 0
text-align: center
font-size: 2.5rem
@ -212,10 +212,8 @@
.banner-picture
margin: 0 auto
width: 4rem
height: 4rem
display: flex
.banner-small

View file

@ -8,6 +8,12 @@
{% endif %}
<script type="text/javascript">
function moreInfo() {
popUpShow('{{ user.username }}',
'<p>Joined: {{ user.joined_at }}</p><br>' +
'<p>Images: {{ images|length }}</p><br>' +
'<p>Groups: {{ groups|length }}</p>');
}
</script>
<style>
@ -16,7 +22,7 @@
}
</style>
{% endblock %}
{% block nav_profile %}selected{% endblock %}
{% block nav_profile %}{% if user.id == current_user.id %}selected{% endif %}{% endblock %}
{% block content %}
<div class="banner">
{% if user.banner %}
@ -27,9 +33,21 @@
<span class="banner-filter"></span>
<div class="banner-content">
{% if user.picture %}
<img class="banner-picture" src="{{ url_for('api.media', path='pfp/' + user.picture) }}" alt="Profile picture" onload="imgFade(this)" style="opacity:0;"/>
<img
class="banner-picture"
src="{{ url_for('api.media', path='pfp/' + user.picture) }}?r=pfp"
alt="Profile picture"
onload="imgFade(this)"
style="opacity:0;"
/>
{% else %}
<img class="banner-picture" src="{{ url_for('static', filename='icon.png') }}" alt="Profile picture" onload="imgFade(this)" style="opacity:0;"/>
<img
class="banner-picture"
src="{{ url_for('static', filename='icon.png') }}"
alt="Profile picture"
onload="imgFade(this)"
style="opacity:0;"
/>
{% endif %}
<h1 class="banner-header">{{ user.username }}</h1>
<p class="banner-subtitle">{{ images|length }} Images · {{ groups|length }} Groups</p>
@ -38,9 +56,11 @@
<button class="pill-item" onclick="profileShare()"><i class="ph ph-export"></i></button>
<button class="pill-item" onclick="moreInfo()"><i class="ph ph-info"></i></button>
</div>
<div>
<a href="{{ url_for('settings.general') }}#profileSettings" class="pill-item"><i class="ph ph-user-circle-gear"></i></a>
</div>
{% if user.id == current_user.id %}
<div>
<a href="{{ url_for('settings.general') }}#profileSettings" class="pill-item pill__critical"><i class="ph ph-user-circle-gear"></i></a>
</div>
{% endif %}
</div>
</div>
</div>