Design right sidebar of problem and organization home page (#117)

* Design right sidebar of problem and organization home page

* Change button small and message button
This commit is contained in:
Phuoc Anh Kha Le 2024-06-10 15:13:53 -05:00 committed by GitHub
parent d7cc620a0a
commit 45c1f400a1
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
9 changed files with 510 additions and 445 deletions

File diff suppressed because it is too large Load diff

File diff suppressed because one or more lines are too long

View file

@ -792,10 +792,34 @@ ul.errorlist {
align-self: center !important;
}
.a-problem {
font-size: 15px;
line-height: 1.8;
.link-row {
display: flex;
align-items: center;
padding: 6px;
font-weight: normal;
cursor: pointer;
transition: background-color 0.3s;
a {
color: inherit;
display: flex;
align-items: center;
width: 100%;
text-decoration: none;
i {
width: 1.5em;
}
}
span {
flex-grow: 1;
}
&:hover {
color: $theme_color;
background-color: #f8f8f2;
}
}
a {

View file

@ -53,7 +53,7 @@
{% if actionbar_report_url %}
<span class="actionbar-block">
<a class="actionbar-button black" href="{{actionbar_report_url}}">
<i class="fa fa-flag-o" style="font-size: large;"></i>
<i class="fa fa-flag" style="font-size: large;"></i>
<span class="actionbar-text">{{_("Report")}}</span>
</a>
</span>

View file

@ -24,7 +24,8 @@
</form>
{% else %}
<a href="{{ url('request_organization', organization.id, organization.slug) }}"
class="unselectable button">{{ _('Request membership') }}</a>
class="unselectable button">
{{ _('Request membership') }}</a>
{% endif %}
{% endif %}
</div>

View file

@ -4,71 +4,64 @@
<h3><i class="fa fa-cog"></i>{{ _('Controls') }}</h3>
<ul id="control-list" class="sidebox-content" style="margin: 0;">
{% if can_edit %}
<li>
<div>
<a href="{{ url('edit_organization', organization.id, organization.slug) }}">{{ _('Edit group') }}</a>
<div class="link-row">
<a href="{{ url('edit_organization', organization.id, organization.slug) }}">
<i class="fa fa-edit"></i>{{ _('Edit group') }}</a>
</div>
</li>
{% endif %}
{% if can_edit and not organization.is_open %}
<li>
<div>
<a href="{{ url('organization_requests_pending', organization.id, organization.slug) }}">{{ _('View requests') }}</a>
<div class="link-row">
<a href="{{ url('organization_requests_pending', organization.id, organization.slug) }}">
<i class="fa fa-inbox"></i>{{ _('View requests') }}</a>
{% if pending_count > 0 %}
<span id="pending-count-box">
{{pending_count}}
</span>
{% endif %}
</div>
</li>
{% endif %}
{% if can_edit %}
<li>
<div>
<a href="{{ url('add_organization_member', organization.id, organization.slug) }}">{{ _('Add members') }}</a>
<div class="link-row">
<a href="{{ url('add_organization_member', organization.id, organization.slug) }}">
<i class="fa fa-user-plus"></i>{{ _('Add members') }}</a>
</div>
</li>
{% endif %}
{% if is_member %}
<li>
<div>
<a href="{{ url('add_organization_blog', organization.id, organization.slug) }}">{{ _('Add blog') }}</a>
<div class="link-row">
<a href="{{ url('add_organization_blog', organization.id, organization.slug) }}">
<i class="fa fa-pencil"></i>{{ _('Add blog') }}</a>
</div>
</li>
{% endif %}
<li>
<div>
<a href="{{ url('organization_pending_blogs', organization.id, organization.slug) }}">{{ _('Pending blogs') }}</a>
<div class="link-row">
<a href="{{ url('organization_pending_blogs', organization.id, organization.slug) }}">
<i class="fa fa-clipboard-list"></i>{{ _('Pending blogs') }}</a>
{% if pending_blog_count > 0 %}
<span id="pending-count-box">
{{pending_blog_count}}
</span>
{% endif %}
</div>
</li>
{% if can_edit %}
<li>
<div>
<a href="{{ url('organization_contest_add', organization.id, organization.slug) }}">{{ _('Add contest') }}</a>
<div class="link-row">
<a href="{{ url('organization_contest_add', organization.id, organization.slug) }}">
<i class="fa fa-calendar-plus"></i>{{ _('Add contest') }}</a>
</div>
</li>
{% endif %}
{% if is_member %}
<li>
<div>
<div class="link-row">
<a href="{{ organization_subdomain }}" target="_blank">
{{_('Subdomain')}}
<i class="fa fa-globe"></i>{{_('Subdomain')}}
</a>
</div>
</li>
{% endif %}
{% if is_member and not is_admin %}
<li>
<div class="link-row" style="color: red;">
<form method="post" action="{{ url('leave_organization', organization.id, organization.slug) }}">
{% csrf_token %}
<a href="#" class="leave-organization">{{ _('Leave group') }}</a>
<a href="#" class="leave-organization">
<i class="fa fa-sign-out-alt"></i>{{ _('Leave group') }}</a>
</form>
</li>
</div>
{% endif %}
</ul>
</div>

View file

@ -131,7 +131,7 @@
<a id="pdf_button" class="view-pdf" href='#'>
{% endif %}
<span class="pdf-icon">
<span class="fa fa-file-pdf-o pdf-icon-logo"></span>
<span class="fa fa-file-pdf pdf-icon-logo"></span>
<span class="pdf-icon-bar"></span>
</span>
{{ _('View as PDF') }}
@ -147,7 +147,7 @@
<button class="btn-green btn btn-primary btn-block btn-round">
<span>{{ _('Submit') }}</span>
<div class="icon icon-round d-flex align-items-center justify-content-center">
<i class="fa fa-send"></i>
<i class="fa fa-paper-plane"></i>
</div>
</button>
</a>
@ -162,7 +162,7 @@
<button class="btn btn-disabled btn-block btn-round">
<span>{{ _('Submit') }}</span>
<div class="icon icon-round d-flex align-items-center justify-content-center">
<i class="fa fa-send"></i>
<i class="fa fa-paper-plane"></i>
</div>
</button>
<div class="no-submissions-left submissions-left">{{ _('0 submissions left') }}</div>
@ -172,7 +172,7 @@
<button class="btn-green btn btn-primary btn-block btn-round">
<span>{{ _('Submit') }}</span>
<div class="icon icon-round d-flex align-items-center justify-content-center">
<i class="fa fa-send"></i>
<i class="fa fa-paper-plane"></i>
</div>
</button>
</a>
@ -181,55 +181,85 @@
<hr style="padding-bottom: 0.3em">
{% if request.user.is_authenticated and has_submissions %}
<div>
<a class="a-problem" href="{{ url('user_submissions', problem.code, request.user.username) }}">{{ _('My submissions') }}</a>
</div>
{% endif %}
<div><a class="a-problem" href="{{ url('chronological_submissions', problem.code) }}">{{ _('All submissions') }}</a></div>
<div><a class="a-problem" href="{{ url('ranked_submissions', problem.code) }}">{{ _('Best submissions') }}</a></div>
{% if editorial and editorial.is_public and
not (request.user.is_authenticated and request.in_contest_mode) %}
<hr>
<div><a class="a-problem" href="{{ url('problem_editorial', problem.code) }}">{{ _('Read editorial') }}</a></div>
{% endif %}
{% if can_edit_problem %}
<hr>
<div>
<a class="a-problem" href="{{ url('problem_ticket_list', problem.code) }}">{{ _('Manage tickets') }}
{% if num_open_tickets %}<span class="badge">{{ num_open_tickets }}</span>{% endif %}
<div class="link-row">
<a href="{{url('user_submissions', problem.code, request.user.username) }}">
<i class="fa fa-address-book"></i><span> {{ _('My submissions') }}</span>
</a>
</div>
{% endif %}
<div class="link-row">
<a href="{{ url('chronological_submissions', problem.code) }}">
<i class="fa fa-rectangle-list"></i><span> {{ _('All submissions') }}</span>
</a>
</div>
<div class="link-row">
<a href="{{ url('ranked_submissions', problem.code) }}">
<i class="fa fa-list-check"></i><span> {{ _('Best submissions') }}</span>
</a>
</div>
{% if editorial and editorial.is_public and not (request.user.is_authenticated and request.in_contest_mode) %}
<hr>
<div class="link-row">
<a href="{{ url('problem_editorial', problem.code) }}">
<i class="fa fa-newspaper"></i><span> {{ _('Read editorial') }}</span>
</a>
</div>
{% endif %}
{% if can_edit_problem %}
<hr>
<div class="link-row">
<a href="{{ url('problem_ticket_list', problem.code) }}">
<i class="fa fa-clipboard-list"></i><span> {{ _('Manage tickets') }}
{% if num_open_tickets %}<span class="badge">{{ num_open_tickets }}</span>{% endif %}
</span>
</a>
</div>
<div class="link-row">
<a href="{{ url('admin:judge_problem_change', problem.id) }}">
<i class="fa fa-edit"></i><span> {{ _('Edit problem') }}</span>
</a>
</div>
<div><a class="a-problem" href="{{ url('admin:judge_problem_change', problem.id) }}">{{ _('Edit problem') }}</a></div>
{% if not problem.is_manually_managed %}
<div><a class="a-problem" href="{{ url('problem_data', problem.code) }}">{{ _('Edit test data') }}</a></div>
{% endif %}
{% elif request.user.is_authenticated and has_tickets %}
<hr>
<div>
<a class="a-problem" href="{{ url('problem_ticket_list', problem.code) }}">{{ _('My tickets') }}
{% if num_open_tickets %}<span class="badge">{{ num_open_tickets }}</span>{% endif %}
<div class="link-row">
<a href="{{ url('problem_data', problem.code) }}">
<i class="fa fa-database"></i><span> {{ _('Edit test data') }}</span>
</a>
</div>
{% endif %}
{% if problem.is_subs_manageable_by(request.user) %}
<div>
<a class="a-problem" href="{{ url('problem_manage_submissions', problem.code) }}">{{ _('Manage submissions') }}</a>
{% endif %}
{% elif request.user.is_authenticated and has_tickets %}
<hr>
<div class="link-row">
<a href="{{ url('problem_ticket_list', problem.code) }}">
<i class="fa fa-inbox"></i><span> {{ _('My tickets') }}
{% if num_open_tickets %}<span class="badge">{{ num_open_tickets }}</span>{% endif %}
</span>
</a>
</div>
{% endif %}
{% endif %}
{% if perms.judge.clone_problem %}
<div>
<a class="a-problem" href="{{ url('problem_clone', problem.code) }}">{{ _('Clone problem') }}</a>
{% if problem.is_subs_manageable_by(request.user) %}
<div class="link-row">
<a href="{{ url('problem_manage_submissions', problem.code) }}">
<i class="fas fa-table"></i><span> {{ _('Manage submissions') }}</span>
</a>
</div>
{% endif %}
{% endif %}
{% if problem.language_time_limit or problem.language_memory_limit %}
{% if perms.judge.clone_problem %}
<div class="link-row">
<a href="{{ url('problem_clone', problem.code) }}">
<i class="fas fa-clone"></i><span> {{ _('Clone problem') }}</span>
</a>
</div>
{% endif %}
{% if problem.language_time_limit or problem.language_memory_limit %}
<hr style="padding-top: 0.3em">
{% endif %}
{% if problem.language_time_limit %}
{% endif %}
{% if problem.language_time_limit %}
<div class="problem-info-entry">
<i class="fa fa-clock-o fa-fw"></i><span class="pi-name">{{ _('Time limit:') }}</span>
<i class="fa fa-clock"></i><span class="pi-name"> {{ _('Time limit:') }}</span>
</div>
<div class="problem-lang-limits">
{% for name, limit in problem.language_time_limit %}
@ -239,10 +269,10 @@
</div>
{% endfor %}
</div>
{% endif %}
{% if problem.language_memory_limit %}
{% endif %}
{% if problem.language_memory_limit %}
<div class="problem-info-entry">
<i class="fa fa-server fa-fw"></i><span class="pi-name">{{ _('Memory limit:') }}</span>
<i class="fa fa-server"></i><span class="pi-name"> {{ _('Memory limit:') }}</span>
</div>
<div class="problem-lang-limits">
{% for name, limit in problem.language_memory_limit %}
@ -252,15 +282,15 @@
</div>
{% endfor %}
</div>
{% endif%}
{% endif%}
<hr style="padding-top: 0.7em">
<hr style="padding-top: 0.7em">
{% with authors=problem.get_authors() %}
{% with authors=problem.get_authors() %}
{% if authors %}
<div class="problem-info-entry">
<i class="far fa-pen-to-square"></i><span
class="pi-name">{% trans trimmed count=authors|length %}
class="pi-name"> {% trans trimmed count=authors|length %}
Author:
{% pluralize count %}
Authors:
@ -268,13 +298,13 @@
<div class="pi-value authors-value">{{ link_users(authors) }}</div>
</div>
{% endif %}
{% endwith %}
{% endwith %}
{% if not contest_problem or not contest_problem.contest.hide_problem_tags %}
{% if not contest_problem or not contest_problem.contest.hide_problem_tags %}
<div id="problem-types">
{% with types=problem.types_list %}
<div class="toggle closed unselectable">
<i class="fa fa-chevron-right fa-fw"></i>{% trans trimmed count=problem.types_list|length %}
<i class="fa fa-chevron-right"></i> {% trans trimmed count=problem.types_list|length %}
Problem type
{% pluralize count %}
Problem types
@ -283,11 +313,11 @@
<div style="display:none" class="toggled">{{ problem.types_list|join(", ") }}</div>
{% endwith %}
</div>
{% endif %}
{% if show_languages %}
{% endif %}
{% if show_languages %}
<div id="allowed-langs">
<div class="toggle open unselectable">
<i class="fa fa-chevron-right fa-fw"></i>{{ _('Allowed languages') }}
<i class="fa fa-chevron-right"></i> {{ _('Allowed languages') }}
</div>
<div class="toggled">
{% with usable=problem.usable_common_names, langs=problem.languages_list() %}
@ -302,12 +332,12 @@
{% endwith %}
</div>
</div>
{% endif %}
{% if problem.is_editable_by(request.user) %}
{% endif %}
{% if problem.is_editable_by(request.user) %}
<div id="available-judges">
<div class="toggle closed" id="judge-toggle">
<i class="fa fa-chevron-right fa-fw"></i><span
class="pi-name">{% trans trimmed count=available_judges|length %}
<i class="fa fa-chevron-right"></i><span
class="pi-name"> {% trans trimmed count=available_judges|length %}
Judge
{% pluralize count %}
Judges
@ -329,7 +359,7 @@
{% endif %}
</div>
</div>
{% endif %}
{% endif %}
{% endblock %}
{% block description %}
@ -345,7 +375,7 @@
{% endif %}
<div class = "new-problem-info d-flex-problem">
<span class="info-block">
<i class="fa fa-check fa-fw"></i><span class="pi-name">{{ _('Points:') }}</span>
<i class="fa fa-check"></i><span class="pi-name"> {{ _('Points:') }}</span>
<span class="new-pi-value">
{% if contest_problem %}
{{ contest_problem.points }} {% if contest_problem.partial %}(p){% endif %}
@ -356,24 +386,24 @@
</span>
<span class="info-block">
<i class="fa fa-clock-o fa-fw"></i><span class="pi-name">{{ _('Time limit:') }}</span>
<i class="fa fa-clock"></i><span class="pi-name"> {{ _('Time limit:') }}</span>
<span class="new-pi-value">{{ problem.time_limit }}s</span>
</span>
<span class="info-block">
<i class="fa fa-server fa-fw"></i><span class="pi-name">{{ _('Memory limit:') }}</span>
<i class="fa fa-server"></i><span class="pi-name"> {{ _('Memory limit:') }}</span>
<span class="new-pi-value">{{ problem.memory_limit|kbsimpleformat }}</span>
</span>
<span class="info-block">
<i class="fa fa-file-o fa-fw"></i><span class="pi-name">{{ _('Input:') }}</span>
<i class="fa fa-file"></i><span class="pi-name"> {{ _('Input:') }}</span>
<span class="new-pi-value">
{{ fileio_input or _('stdin') }}
</span>
</span>
<span>
<i class="fa fa-file fa-fw"></i><span class="pi-name">{{ _('Output:') }}</span>
<i class="fa fa-file"></i><span class="pi-name"> {{ _('Output:') }}</span>
<span class="new-pi-value">{{ fileio_output or _('stdout') }}</span>
</span>
</div>

View file

@ -135,19 +135,23 @@
{% block body %}
<div style="clear: both"></div>
<br>
<div style="width: fit-content;">
{% if request.profile == submission.user or perms.judge.resubmit_other %}
<div><a href="{{ url('problem_submit', submission.problem.code, submission.id) }}">{{ _('Resubmit') }}</a></div>
<div class="link-row"><a href="{{ url('problem_submit', submission.problem.code, submission.id) }}">
<i class="fa fa-upload"></i>{{ _('Resubmit') }}</a></div>
{% endif %}
{% if perms.judge.rejudge_submission %}
<div>
<div class="link-row">
<form action="{{ url('submission_rejudge') }}" method="post">
{% csrf_token %}
<a href="#" onclick="parentNode.submit()">{{ _('Rejudge') }}</a>
<a href="#" onclick="parentNode.submit()">
<i class="fa fa-rotate-right"></i>{{ _('Rejudge') }}</a>
<input type="hidden" name="id" value="{{ submission.id }}">
<input type="hidden" name="path" value="{{ url('submission_status', submission.id) }}">
</form>
</div>
{% endif %}
</div>
<br>
<h3 id="source-header" class="toggle closed"><i class="fa fa-chevron-right fa-fw"></i>{{_('Source code')}}</h3>

View file

@ -112,7 +112,7 @@
{% if request.user.is_authenticated and request.profile != user %}
<br>
<button class="small btn-midnightblue" style="width:100%" id="message-button">
{{ _('Send message') }}
<i class="fa fa-envelope"></i> {{ _('Message') }}
</button>
{% endif %}