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>
</li>
<div class="link-row">
<a href="{{ url('edit_organization', organization.id, organization.slug) }}">
<i class="fa fa-edit"></i>{{ _('Edit group') }}</a>
</div>
{% endif %}
{% if can_edit and not organization.is_open %}
<li>
<div>
<a href="{{ url('organization_requests_pending', organization.id, organization.slug) }}">{{ _('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>
</li>
{% endif %}
{% if is_member %}
<li>
<div>
<a href="{{ url('add_organization_blog', organization.id, organization.slug) }}">{{ _('Add blog') }}</a>
</div>
</li>
{% endif %}
<li>
<div>
<a href="{{ url('organization_pending_blogs', organization.id, organization.slug) }}">{{ _('Pending blogs') }}</a>
{% if pending_blog_count > 0 %}
<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_blog_count}}
{{pending_count}}
</span>
{% endif %}
</div>
</li>
{% endif %}
{% if can_edit %}
<li>
<div>
<a href="{{ url('organization_contest_add', organization.id, organization.slug) }}">{{ _('Add contest') }}</a>
</div>
</li>
<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>
{% endif %}
{% if is_member %}
<li>
<div>
<a href="{{ organization_subdomain }}" target="_blank">
{{_('Subdomain')}}
</a>
</div>
</li>
<div class="link-row">
<a href="{{ url('add_organization_blog', organization.id, organization.slug) }}">
<i class="fa fa-pencil"></i>{{ _('Add blog') }}</a>
</div>
{% endif %}
<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>
{% if can_edit %}
<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>
{% endif %}
{% if is_member %}
<div class="link-row">
<a href="{{ organization_subdomain }}" target="_blank">
<i class="fa fa-globe"></i>{{_('Subdomain')}}
</a>
</div>
{% 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,155 +181,185 @@
<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 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><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('chronological_submissions', problem.code) }}">
<i class="fa fa-rectangle-list"></i><span> {{ _('All submissions') }}</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>
<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 %}
{% 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 %}
</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>
</div>
{% endif %}
{% if perms.judge.clone_problem %}
<div>
<a class="a-problem" href="{{ url('problem_clone', problem.code) }}">{{ _('Clone problem') }}</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 %}
<div class="problem-info-entry">
<i class="fa fa-clock-o fa-fw"></i><span class="pi-name">{{ _('Time limit:') }}</span>
</div>
<div class="problem-lang-limits">
{% for name, limit in problem.language_time_limit %}
<div class="lang-limit">
<span class="lang-name">{{ name }}</span>
<span class="lang-tl">{{ limit }}s</span>
{% 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>
{% if not problem.is_manually_managed %}
<div class="link-row">
<a href="{{ url('problem_data', problem.code) }}">
<i class="fa fa-database"></i><span> {{ _('Edit test data') }}</span>
</a>
</div>
{% endfor %}
</div>
{% 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>
</div>
<div class="problem-lang-limits">
{% for name, limit in problem.language_memory_limit %}
<div class="lang-limit">
<span class="lang-name">{{ name }}</span>
<span class="lang-ml">{{ limit|kbsimpleformat }}</span>
</div>
{% endfor %}
</div>
{% endif%}
{% 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 %}
<hr style="padding-top: 0.7em">
{% 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 %}
{% with authors=problem.get_authors() %}
{% if authors %}
{% 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 %}
<div class="problem-info-entry">
<i class="far fa-pen-to-square"></i><span
class="pi-name">{% trans trimmed count=authors|length %}
Author:
{% pluralize count %}
Authors:
{% endtrans %}</span>
<div class="pi-value authors-value">{{ link_users(authors) }}</div>
<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 %}
<div class="lang-limit">
<span class="lang-name">{{ name }}</span>
<span class="lang-tl">{{ limit }}s</span>
</div>
{% endfor %}
</div>
{% endif %}
{% endwith %}
{% 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 %}
Problem type
{% pluralize count %}
Problem types
{% endtrans %}
</div>
<div style="display:none" class="toggled">{{ problem.types_list|join(", ") }}</div>
{% endwith %}
</div>
{% endif %}
{% if show_languages %}
<div id="allowed-langs">
<div class="toggle open unselectable">
<i class="fa fa-chevron-right fa-fw"></i>{{ _('Allowed languages') }}
{% if problem.language_memory_limit %}
<div class="problem-info-entry">
<i class="fa fa-server"></i><span class="pi-name"> {{ _('Memory limit:') }}</span>
</div>
<div class="toggled">
{% with usable=problem.usable_common_names, langs=problem.languages_list() %}
{% for lang in langs %}
{%- if lang in usable -%}
{{ lang }}
{%- else -%}
<s title="{{ _('No %(lang)s judge online', lang=lang) }}">{{ lang }}</s>
{%- endif -%}
{% if not loop.last %}, {% endif -%}
{% endfor %}
<div class="problem-lang-limits">
{% for name, limit in problem.language_memory_limit %}
<div class="lang-limit">
<span class="lang-name">{{ name }}</span>
<span class="lang-ml">{{ limit|kbsimpleformat }}</span>
</div>
{% endfor %}
</div>
{% endif%}
<hr style="padding-top: 0.7em">
{% 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 %}
Author:
{% pluralize count %}
Authors:
{% endtrans %}</span>
<div class="pi-value authors-value">{{ link_users(authors) }}</div>
</div>
{% endif %}
{% endwith %}
{% 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"></i> {% trans trimmed count=problem.types_list|length %}
Problem type
{% pluralize count %}
Problem types
{% endtrans %}
</div>
<div style="display:none" class="toggled">{{ problem.types_list|join(", ") }}</div>
{% endwith %}
</div>
</div>
{% 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 %}
Judge
{% pluralize count %}
Judges
{% endtrans %}
</span>
</div>
<div class="pi-value judges-value toggled" style="display: none;">
{% if available_judges %}
{% if perms.judge.change_judge %}
{% for judge in available_judges %}
<a href="{{ url('admin:judge_judge_change', judge.id) }}">{{ judge.name }}</a>
{%- if not loop.last %}, {% endif %}
{% endif %}
{% if show_languages %}
<div id="allowed-langs">
<div class="toggle open unselectable">
<i class="fa fa-chevron-right"></i> {{ _('Allowed languages') }}
</div>
<div class="toggled">
{% with usable=problem.usable_common_names, langs=problem.languages_list() %}
{% for lang in langs %}
{%- if lang in usable -%}
{{ lang }}
{%- else -%}
<s title="{{ _('No %(lang)s judge online', lang=lang) }}">{{ lang }}</s>
{%- endif -%}
{% if not loop.last %}, {% endif -%}
{% endfor %}
{% else %}
{{ available_judges|join(", ") }}
{% endif %}
{% else %}
<i class="red">{{ _('none available') }}</i>
{% endif %}
{% endwith %}
</div>
</div>
</div>
{% endif %}
{% 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"></i><span
class="pi-name"> {% trans trimmed count=available_judges|length %}
Judge
{% pluralize count %}
Judges
{% endtrans %}
</span>
</div>
<div class="pi-value judges-value toggled" style="display: none;">
{% if available_judges %}
{% if perms.judge.change_judge %}
{% for judge in available_judges %}
<a href="{{ url('admin:judge_judge_change', judge.id) }}">{{ judge.name }}</a>
{%- if not loop.last %}, {% endif %}
{% endfor %}
{% else %}
{{ available_judges|join(", ") }}
{% endif %}
{% else %}
<i class="red">{{ _('none available') }}</i>
{% endif %}
</div>
</div>
{% 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>
{% if request.profile == submission.user or perms.judge.resubmit_other %}
<div><a href="{{ url('problem_submit', submission.problem.code, submission.id) }}">{{ _('Resubmit') }}</a></div>
{% endif %}
{% if perms.judge.rejudge_submission %}
<div>
<form action="{{ url('submission_rejudge') }}" method="post">
{% csrf_token %}
<a href="#" onclick="parentNode.submit()">{{ _('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 style="width: fit-content;">
{% if request.profile == submission.user or perms.judge.resubmit_other %}
<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 class="link-row">
<form action="{{ url('submission_rejudge') }}" method="post">
{% csrf_token %}
<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 %}