Standardize user image + minor bugs

This commit is contained in:
cuom1999 2024-04-12 01:51:57 -05:00
parent 5147980d43
commit 208a4e4ef7
23 changed files with 608 additions and 540 deletions

View file

@ -0,0 +1,18 @@
# Generated by Django 3.2.18 on 2024-04-12 05:50
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
("judge", "0184_contest_rate_limit"),
]
operations = [
migrations.RenameField(
model_name="organizationprofile",
old_name="users",
new_name="profile",
),
]

View file

@ -481,7 +481,7 @@ class Friend(models.Model):
class OrganizationProfile(models.Model): class OrganizationProfile(models.Model):
users = models.ForeignKey( profile = models.ForeignKey(
Profile, Profile,
verbose_name=_("user"), verbose_name=_("user"),
related_name="last_visit", related_name="last_visit",
@ -500,22 +500,26 @@ class OrganizationProfile(models.Model):
) )
@classmethod @classmethod
def remove_organization(self, users, organization): def remove_organization(self, profile, organization):
organizationprofile = self.objects.filter( organization_profile = self.objects.filter(
users=users, organization=organization profile=profile, organization=organization
) )
if organizationprofile.exists(): if organization_profile.exists():
organizationprofile.delete() organization_profile.delete()
@classmethod @classmethod
def add_organization(self, users, organization): def add_organization(self, profile, organization):
self.remove_organization(users, organization) self.remove_organization(profile, organization)
new_organization = OrganizationProfile(users=users, organization=organization) new_row = OrganizationProfile(profile=profile, organization=organization)
new_organization.save() new_row.save()
@classmethod @classmethod
def get_most_recent_organizations(self, users): def get_most_recent_organizations(cls, profile):
return self.objects.filter(users=users).order_by("-last_visit")[:5] queryset = cls.objects.filter(profile=profile).order_by("-last_visit")[:5]
queryset = queryset.select_related("organization").defer("organization__about")
organizations = [op.organization for op in queryset]
return organizations
@receiver([post_save], sender=User) @receiver([post_save], sender=User)

View file

@ -242,6 +242,7 @@ class OrganizationList(TitleMixin, ListView, OrganizationBase):
super(OrganizationList, self) super(OrganizationList, self)
.get_queryset() .get_queryset()
.annotate(member_count=Count("member")) .annotate(member_count=Count("member"))
.defer("about")
) )
def get_context_data(self, **kwargs): def get_context_data(self, **kwargs):

View file

@ -182,9 +182,6 @@ header {
cursor: pointer; cursor: pointer;
padding: 3.5px; padding: 3.5px;
} }
img {
border-radius: 50%;
}
} }
#nav-shadow { #nav-shadow {

View file

@ -532,6 +532,7 @@ $(function() {
content = JSON.parse(content); content = JSON.parse(content);
$('#content').html(content.html); $('#content').html(content.html);
onWindowReady(); onWindowReady();
window.PAGE_FROM_BACK_BUTTON_CACHE = true;
$(window).scrollTop(content.scrollOffset - 100); $(window).scrollTop(content.scrollOffset - 100);
window.page = content.page; window.page = content.page;
window.has_next_page = content.has_next_page; window.has_next_page = content.has_next_page;

File diff suppressed because it is too large Load diff

6
resources/libs/popper.min.js vendored Normal file

File diff suppressed because one or more lines are too long

View file

@ -85,20 +85,9 @@
} }
} }
.sub-user-img { .sub-user-img {
flex-shrink: 0;
width: 70px; width: 70px;
height: 70px; height: 70px;
background-color: #ddd;
border-radius: 50%;
overflow: hidden;
margin-right: 15px; margin-right: 15px;
display: flex;
align-items: center;
img {
width: 100%;
height: auto;
}
} }
} }

View file

@ -267,7 +267,7 @@ a.edit-profile {
.user-sidebar { .user-sidebar {
flex: 0 0 150px; flex: 0 0 150px;
padding-left: 1em; padding-right: 1em;
} }
.user-content { .user-content {
@ -276,6 +276,20 @@ a.edit-profile {
word-wrap: break-word; word-wrap: break-word;
} }
.user-img {
flex-shrink: 0;
background-color: #ddd;
border-radius: 50%;
overflow: hidden;
display: flex;
align-items: center;
img {
width: 100%;
height: auto;
}
}
@media not all and (min-width: 600px) { @media not all and (min-width: 600px) {
.user-info-page { .user-info-page {
display: block; display: block;

View file

@ -179,7 +179,7 @@
</span> </span>
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<span id="user-links"> <span id="user-links">
<img src="{{ gravatar(request.profile, 32) }}" height="24" width="24"> <img class="user-img" src="{{ gravatar(request.profile, 32) }}" height="24" width="24">
<i class="fa fa-angle-down" style="font-size: 18px; padding-top: 8px;"></i> <i class="fa fa-angle-down" style="font-size: 18px; padding-top: 8px;"></i>
</span> </span>
<div class="dropdown" id="userlink_dropdown" role="tooptip"> <div class="dropdown" id="userlink_dropdown" role="tooptip">
@ -277,9 +277,9 @@
<div id="announcement">{{ i18n_config.announcement|safe }}</div> <div id="announcement">{{ i18n_config.announcement|safe }}</div>
{% endif %} {% endif %}
<script src="https://unpkg.com/@popperjs/core@2"></script>
{% compress js %} {% compress js %}
<script>{{ inlinei18n(LANGUAGE_CODE)|safe }}</script> <script>{{ inlinei18n(LANGUAGE_CODE)|safe }}</script>
<script src="{{ static('libs/popper.min.js') }}"></script>
<script src="{{ static('libs/jquery-cookie.js') }}"></script> <script src="{{ static('libs/jquery-cookie.js') }}"></script>
<script src="{{ static('libs/jquery-taphold.js') }}"></script> <script src="{{ static('libs/jquery-taphold.js') }}"></script>
<script src="{{ static('libs/jquery.unveil.js') }}"></script> <script src="{{ static('libs/jquery.unveil.js') }}"></script>

View file

@ -1,10 +1,12 @@
{% for post in posts%} {% for post in posts%}
<section class="{% if post.sticky %}sticky {% endif %}blog-box"> <section class="{% if post.sticky %}sticky {% endif %}blog-box">
<div style="margin-bottom: 0.5em"> <div style="margin-bottom: 0.5em">
<span class="time"> <span class="item-header time">
{% with authors=post.authors.all() %} {% with authors=post.authors.all() %}
{%- if authors -%} {%- if authors -%}
<img src="{{gravatar(authors[0])}}" style="width: 1.5em; border-radius: 50%; margin-bottom: -0.3em"> <span class="user-img" style="width: 1.5em; height: 1.5em">
<img src="{{gravatar(authors[0])}}">
</span>
<span class="post-authors">{{ link_users(authors) }}</span> <span class="post-authors">{{ link_users(authors) }}</span>
{%- endif -%} {%- endif -%}
{% endwith %} {% endwith %}

View file

@ -7,8 +7,11 @@
clear: both; clear: both;
} }
} }
.time { .item-header {
margin-left: 0; margin-left: 0;
display: inline-flex;
align-items: center;
gap: 0.2em;
} }
.no-clarifications-message { .no-clarifications-message {

View file

@ -66,7 +66,6 @@
.profile-pic { .profile-pic {
height: 2.6em; height: 2.6em;
width: 2.6em; width: 2.6em;
border-radius: 50%;
margin-top: 0.1em; margin-top: 0.1em;
float: left; float: left;
} }

View file

@ -1,6 +1,6 @@
<li class="message" id="message-{{ message.id }}" message-id="{{ message.id }}"> <li class="message" id="message-{{ message.id }}" message-id="{{ message.id }}">
<a href="{{ url('user_page', message.author.username) }}"> <a href="{{ url('user_page', message.author.username) }}">
<img src="{{ gravatar(message.author, 135) }}" class="profile-pic"> <img src="{{ gravatar(message.author, 135) }}" class="profile-pic user-img">
</a> </a>
<div class="body-message"> <div class="body-message">
<div class="user-time"> <div class="user-time">

View file

@ -1,6 +1,6 @@
<li class="status-row" id="lobby_row"> <li class="status-row" id="lobby_row">
<div class="status-container"> <div class="status-container">
<img src="{{ static('icons/logo.svg') }}" style="height:1.3em"> <img src="{{ static('icons/icon.svg') }}" style="height:32px">
</div> </div>
<span style="padding-left:0.5em"> <span style="padding-left:0.5em">
<b>{{_('Lobby')}}</b> <b>{{_('Lobby')}}</b>
@ -23,7 +23,7 @@
{% for user in section.user_list %} {% for user in section.user_list %}
<li class="click_space status-row" id="click_space_{{user.user.id}}" value="{{user.url}}"> <li class="click_space status-row" id="click_space_{{user.user.id}}" value="{{user.url}}">
<div class="status-container"> <div class="status-container">
<img src="{{ gravatar(user.user, 135) }}" class="status-pic"> <img src="{{ gravatar(user.user, 135) }}" class="status-pic user-img">
<svg style="position:absolute;" height="32" width="32"> <svg style="position:absolute;" height="32" width="32">
<circle class="status-circle" fill="{{'green' if user.is_online else 'red'}}"/> <circle class="status-circle" fill="{{'green' if user.is_online else 'red'}}"/>
</svg> </svg>

View file

@ -3,7 +3,7 @@
</div> </div>
{% if other_user %} {% if other_user %}
<div class="status-container" style="height: 3em; width: 3em;"> <div class="status-container" style="height: 3em; width: 3em;">
<img src="{{ gravatar(other_user, 135) }}" class="info-pic"> <img src="{{ gravatar(other_user, 135) }}" class="info-pic user-img">
<svg style="position:absolute; height:100%; width: 100%; transform: rotate(180deg);" > <svg style="position:absolute; height:100%; width: 100%; transform: rotate(180deg);" >
<circle class="info-circle" <circle class="info-circle"
fill="{{'green' if other_online else 'red'}}"/> fill="{{'green' if other_online else 'red'}}"/>
@ -11,7 +11,7 @@
</div> </div>
{% else %} {% else %}
<div class="status-container" style="height: 3em;"> <div class="status-container" style="height: 3em;">
<img src="{{ static('icons/logo.svg') }}" class="info-pic" style="border-radius: 0px;"> <img src="{{ static('icons/icon.svg') }}" class="info-pic" style="border-radius: 0px;">
</div> </div>
{% endif %} {% endif %}
<span class="info-name username"> <span class="info-name username">

View file

@ -25,8 +25,8 @@
<div class="detail"> <div class="detail">
<div class="header"> <div class="header">
{% with author=node.author, user=node.author.user %} {% with author=node.author, user=node.author.user %}
<a href="{{ url('user_page', user.username) }}" class="user comment-img"> <a href="{{ url('user_page', user.username) }}" class="user comment-img user-img">
<img src="{{ gravatar(author, 135) }}" class="gravatar"> <img src="{{ gravatar(author, 135) }}">
</a> </a>
{% endwith %} {% endwith %}
{{ link_user(node.author) }},&nbsp; {{ link_user(node.author) }},&nbsp;

View file

@ -5,12 +5,9 @@
.organization-container .organization-row:last-child { .organization-container .organization-row:last-child {
border-bottom: none; border-bottom: none;
} }
.org-logo { .org-logo {
vertical-align: middle;
height: 2em; height: 2em;
width: 2em; width: 2em;
display: inline-block;
margin-right: 1em; margin-right: 1em;
margin-left: 0.5em; margin-left: 0.5em;
} }
@ -31,8 +28,12 @@
<h3 style="padding-bottom: 1em" class="toggle open"><i class="fa fa-chevron-right fa-fw"></i> {{title}} ({{queryset.count()}})</h3> <h3 style="padding-bottom: 1em" class="toggle open"><i class="fa fa-chevron-right fa-fw"></i> {{title}} ({{queryset.count()}})</h3>
<div class="organization-container toggled"> <div class="organization-container toggled">
{% for org in queryset %} {% for org in queryset %}
<a href="{{ org.get_absolute_url() }}" class="organization-row" title="{{org.about}}"> <a href="{{ org.get_absolute_url() }}" class="organization-row">
<img class="org-logo" loading="lazy" src="{{ org.logo_override_image or static('icons/icon.svg') }}" onerror="{{static('icons/logo.svg')}}"> {% if org.logo_override_image %}
<img class="user-img org-logo" loading="lazy" src="{{ org.logo_override_image }}">
{% else %}
<img class="org-logo" loading="lazy" src="{{ static('icons/icon.svg') }}" onerror="{{static('icons/logo.svg')}}">
{% endif %}
<span style="margin-right: auto">{{ org.name }}</span> <span style="margin-right: auto">{{ org.name }}</span>
<span style="font-weight: normal"><i>{{ org.member_count }} {{_('members')}}</i></span> <span style="font-weight: normal"><i>{{ org.member_count }} {{_('members')}}</i></span>
</a> </a>

View file

@ -10,6 +10,7 @@
<script type="text/javascript" src="{{ static('fine-uploader/jquery.fine-uploader.js') }}"></script> <script type="text/javascript" src="{{ static('fine-uploader/jquery.fine-uploader.js') }}"></script>
<script type="text/javascript"> <script type="text/javascript">
$(function () { $(function () {
if (!window.PAGE_FROM_BACK_BUTTON_CACHE) {
$("#problem-data-zipfile_fine_uploader").fineUploader({ $("#problem-data-zipfile_fine_uploader").fineUploader({
request: { request: {
endpoint: "{{url('problem_zip_upload', problem.code)}}", endpoint: "{{url('problem_zip_upload', problem.code)}}",
@ -35,7 +36,9 @@
else { else {
$('#submit-button').click(); $('#submit-button').click();
} }
});; });
toggle_custom();
}
function update_select2() { function update_select2() {
$('tbody:not(.extra-row-body) .type-column select').select2({ $('tbody:not(.extra-row-body) .type-column select').select2({
@ -133,7 +136,7 @@
}).change(); }).change();
} }
(function toggle_custom() { function toggle_custom() {
let $checker = $('#id_problem-data-checker') let $checker = $('#id_problem-data-checker')
let $custom_checker = $('#id_problem-data-custom_checker'); let $custom_checker = $('#id_problem-data-custom_checker');
@ -175,7 +178,7 @@
$tr_sig_header.toggle($ioi_signature.is(':checked')).change(); $tr_sig_header.toggle($ioi_signature.is(':checked')).change();
$tr_sig_handler.toggle($ioi_signature.is(':checked')).change(); $tr_sig_handler.toggle($ioi_signature.is(':checked')).change();
}).change(); }).change();
})(); };
checker_precision($('#id_problem-data-checker')); checker_precision($('#id_problem-data-checker'));

View file

@ -1,10 +1,8 @@
{% block two_col_media %} {% block two_col_media %}
<style> <style>
.org-logo { .org-logo {
vertical-align: middle;
height: 2em; height: 2em;
width: 2em; width: 2em;
display: inline-block;
margin-right: 0.5em; margin-right: 0.5em;
} }
.toggle { .toggle {
@ -21,9 +19,13 @@
<h3 class="bold-text colored-text"><i class="fa fa-users"></i>{{ _('Recent groups') }}</h3> <h3 class="bold-text colored-text"><i class="fa fa-users"></i>{{ _('Recent groups') }}</h3>
<div class="toggled sidebox-content"> <div class="toggled sidebox-content">
{% for organization in recent_organizations %} {% for organization in recent_organizations %}
<a href="{{ url('organization_home', organization.organization.pk, organization.organization.slug) }}" class="organization-row" title="{{organization.organization.about}}"> <a href="{{ url('organization_home', organization.pk, organization.slug) }}" class="organization-row">
<img class="org-logo" loading="lazy" src="{{ organization.organization.logo_override_image or static('icons/icon.svg') }}"> {% if organization.logo_override_image %}
<span style="word-break: break-word;">{{ organization.organization }}</span> <img class="org-logo user-img" loading="lazy" src="{{ organization.logo_override_image }}">
{% else %}
<img class="org-logo" loading="lazy" src="{{ static('icons/icon.svg') }}" onerror="{{static('icons/logo.svg')}}">
{% endif %}
<span style="word-break: break-word;">{{ organization.name }}</span>
</a> </a>
{% endfor %} {% endfor %}
</div> </div>

View file

@ -1,5 +1,5 @@
{% set can_view = submission.is_accessible_by(profile) %} {% set can_view = submission.is_accessible_by(profile) %}
<div class="sub-user-img"> <div class="sub-user-img user-img">
<img src="{{gravatar(submission.user)}}"> <img src="{{gravatar(submission.user)}}">
</div> </div>
<div class="sub-details"> <div class="sub-details">

View file

@ -4,19 +4,10 @@
{% block user_media %}{% endblock %} {% block user_media %}{% endblock %}
<style> <style>
.user-gravatar { .user-profile-img {
display: block; width: 150px;
padding-right: 15px; height: 150px;
width: 145px;
} }
.user-gravatar img {
width: 145px;
height: 145px;
display: block;
border-radius: 6px;
}
.page-title { .page-title {
display: -webkit-box; display: -webkit-box;
display: -webkit-flex; display: -webkit-flex;
@ -100,14 +91,14 @@
{% block body %} {% block body %}
<div class="user-info-page"> <div class="user-info-page">
<div class="user-sidebar"> <div class="user-sidebar">
<div class="user-gravatar"> <div class="user-img user-profile-img">
<img src="{{ gravatar(user, 145) }}" width="145px" height="145px"> <img src="{{ gravatar(user, 145) }}">
</div> </div>
<br> <br>
{% if request.user.is_authenticated and request.profile != user %} {% if request.user.is_authenticated and request.profile != user %}
<form method="post" action="{{ url('user_toggle_follow', user.username) }}"> <form method="post" action="{{ url('user_toggle_follow', user.username) }}">
{% csrf_token %} {% csrf_token %}
<button class="small {{ 'unfollow' if followed else 'follow' }}" style="width:145px"> <button class="small {{ 'unfollow' if followed else 'follow' }}" style="width:100%">
{% if followed %} {% if followed %}
<i class="fa fa-remove"></i> <i class="fa fa-remove"></i>
{{ _('Unfollow') }} {{ _('Unfollow') }}
@ -118,16 +109,16 @@
</button> </button>
</form> </form>
{% endif %} {% endif %}
{% if request.user.is_authenticated %} {% if request.user.is_authenticated and request.profile != user %}
<br> <br>
<button class="small btn-midnightblue" style="width:145px" id="message-button"> <button class="small btn-midnightblue" style="width:100%" id="message-button">
{{ _('Send message') }} {{ _('Send message') }}
</button> </button>
{% endif %} {% endif %}
{% if ratings %} {% if ratings %}
<br> <br>
<div style="border: 3px dashed darkgray; padding: 0.3em; margin-right: 15px; border-radius: 6px;"> <div style="border: 3px dashed darkgray; padding: 0.3em; border-radius: 6px;">
<div class="user-stat-container"> <div class="user-stat-container">
<div class="user-stat-header">{{_('Contests written')}}:</div> <div class="user-stat-header">{{_('Contests written')}}:</div>
<div class="user-stat">{{ratings|length}}</div> <div class="user-stat">{{ratings|length}}</div>

View file

@ -5,7 +5,7 @@
{% endblock %} {% endblock %}
{% block after_rank %} {% block after_rank %}
<td><img style="border: 2px solid lightblue; max-width: none; border-radius: 50%" src="{{ gravatar(user, 45) }}" height="45px" width="45px"></td> <td><img style="border: 2px solid lightblue; max-width: none;" class="user-img" src="{{ gravatar(user, 45) }}" height="45px" width="45px"></td>
{% endblock %} {% endblock %}
{% block user_footer %} {% block user_footer %}