yagich/pyrom
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

make avatar prettier

Browse Source
This commit is contained in:
Lera Elvoé
2026-05-21 22:38:16 +03:00
parent 13667d5f6c
commit 84ee969e7a
3 changed files with 37 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
app/templates/common/macros.html
View File

@@ -110,6 +110,12 @@
{%- endcall -%} {%- endcall -%}
{%- endmacro %} {%- endmacro %}
{% macro avatar(url) -%}
<div class="avatar-container">
<img src="{{url}}" class="avatar">
</div>
{%- endmacro %}
{% macro full_post( {% macro full_post(
post, render_sig=true, is_latest=false, post, render_sig=true, is_latest=false,
show_toolbar=true, is_editing=false, thread=none, show_toolbar=true, is_editing=false, thread=none,
@@ -124,7 +130,7 @@
{%- set can_reply = (is_logged_in()) and (not thread.locked or is_mod()) -%} {%- set can_reply = (is_logged_in()) and (not thread.locked or is_mod()) -%}
<div class="usercard plank even contrast-bg minimal no-shadow"> <div class="usercard plank even contrast-bg minimal no-shadow">
<div class="usercard-inner"> <div class="usercard-inner">
<img src="{{post.avatar_path}}" class="avatar"> {{avatar(post.avatar_path)}}
<div class="usercard-rest"> <div class="usercard-rest">
<a href="{{url_for('users.user_page', username=post.username)}}">{{post.display_name if post.display_name else post.username}}</a> <a href="{{url_for('users.user_page', username=post.username)}}">{{post.display_name if post.display_name else post.username}}</a>
<abbr title="mention">@{{post.username}}</abbr> <abbr title="mention">@{{post.username}}</abbr>

4
app/templates/users/user_page.html
View File

@@ -1,4 +1,4 @@
{%- from 'common/macros.html' import subheader, timestamp, pager -%} {%- from 'common/macros.html' import subheader, timestamp, pager, avatar -%}
{%- extends 'base.html' -%} {%- extends 'base.html' -%}
{%- block title -%}{{ target_user.get_readable_name() }}'s profile{%- endblock -%} {%- block title -%}{{ target_user.get_readable_name() }}'s profile{%- endblock -%}
{%- set stats = target_user.get_post_stats() -%} {%- set stats = target_user.get_post_stats() -%}
@@ -41,7 +41,7 @@
<div class="userpage-usercard"> <div class="userpage-usercard">
<div class="usercard plank even contrast-bg minimal no-shadow"> <div class="usercard plank even contrast-bg minimal no-shadow">
<div class="usercard-inner"> <div class="usercard-inner">
<img src="{{target_user.get_avatar_url()}}" class="avatar"> {{- avatar(target_user.get_avatar_url()) -}}
</div> </div>
</div> </div>
<div class="plank even minimal no-shadow user-stats"> <div class="plank even minimal no-shadow user-stats">

28
data/static/css/style.css
View File

@@ -520,10 +520,34 @@ footer {
gap: var(--base-padding); gap: var(--base-padding);
} }
.usercard.plank {
padding: var(--base-padding);
}
.avatar-container {
position: relative;
display: flex;
border-radius: var(--base-padding);
border: var(--base-padding) outset gray;
box-shadow: 0px 0px 12px 2px #0006;
&::after {
content: '';
position: absolute;
width: 100%;
height: 100%;
box-shadow: inset 0px 0px var(--big-padding) 2px #d4ddc9;
top: 0;
right: 0;
border: 2px solid #545454;
pointer-events: none;
}
.avatar { .avatar {
max-width: 100%; max-width: min(100%, 256px);
max-height: 100%; max-height: min(100%, 256px);
object-fit: contain; object-fit: contain;
}
} }
.post-content { .post-content {