Some UI improvements

This commit is contained in:
cuom1999 2023-03-02 18:43:15 -06:00
parent 0708eb7bb0
commit 5d15cb9bad
21 changed files with 147 additions and 184 deletions

View file

@ -289,7 +289,7 @@ nav {
&:hover { &:hover {
border-top: 2px solid #9c3706; border-top: 2px solid #9c3706;
color: lightcoral; color: black;
background: rgba(255, 255, 255, 0.25); background: rgba(255, 255, 255, 0.25);
margin: 0; margin: 0;
} }
@ -377,7 +377,8 @@ hr {
} }
#content { #content {
margin: 3.2em auto 1em auto; margin: 48px auto 1em auto;
padding-top: 1em;
// Header // Header
width: 90%; width: 90%;

View file

@ -43,12 +43,11 @@
border-bottom: 0; border-bottom: 0;
} }
#chat-online-content { #chat-online-content {
margin-top: 0.5em;
margin-bottom: 0; margin-bottom: 0;
overflow: hidden; overflow: hidden;
overflow-wrap: break-word; overflow-wrap: break-word;
overflow-y: auto; overflow-y: auto;
max-height: 77vh; max-height: calc(100% - 44px);
} }
#chat-box { #chat-box {
/*border: 1px solid #ccc;*/ /*border: 1px solid #ccc;*/
@ -80,7 +79,7 @@
#chat-container { #chat-container {
display: flex; display: flex;
width: 100%; width: 100%;
height: 90vh; height: calc(100vh - 3em);;
border: 1px solid #ccc; border: 1px solid #ccc;
/*border-radius: 0 4px 0 0;*/ /*border-radius: 0 4px 0 0;*/
border-bottom: 0; border-bottom: 0;
@ -96,18 +95,13 @@
font-family: "Noto Sans", Arial, "Lucida Grande", sans-serif; font-family: "Noto Sans", Arial, "Lucida Grande", sans-serif;
} }
.info-pic { .info-pic {
height: 90%; height: 100%;
border-radius: 50%;
padding: 0.05em;
border: 0.1px solid #ccc;
margin-left: 3em;
margin-bottom: 1.5px;
} }
.info-circle { .info-circle {
position: absolute; position: absolute;
cx: 86%; cx: 12%;
cy: 80%; cy: 12%;
r: 6px; r: 12%;
stroke: white; stroke: white;
stroke-width: 1; stroke-width: 1;
} }
@ -116,13 +110,17 @@
font-size: 2em; font-size: 2em;
font-weight: bold !important; font-weight: bold !important;
display: flex; display: flex;
align-items: center;
} }
.info-name a { .info-name a {
display: table-caption; display: table-caption;
} }
#chat-info { #chat-info {
border-bottom: 2px solid darkgray;
display: flex; display: flex;
align-items: center;
box-shadow: 0px 2px 3px rgb(0 0 0 / 20%);
position: relative;
z-index: 100;
} }
#refresh-button { #refresh-button {
padding: 0; padding: 0;
@ -192,9 +190,8 @@
.chat { .chat {
.active-span { .active-span {
margin-top: 1em;
margin-right: 1em;
color: #636363; color: #636363;
margin-right: 1em;
} }
.unread-count { .unread-count {

View file

@ -1575,7 +1575,7 @@ nav ul li button:link {
nav ul li a:hover, nav ul li a:hover,
nav ul li button:hover { nav ul li button:hover {
border-top-color: rgb(199, 70, 8); border-top-color: rgb(199, 70, 8);
color: rgb(239, 120, 120); color: rgb(232, 230, 227);
background-image: initial; background-image: initial;
background-color: rgba(24, 26, 27, 0.25); background-color: rgba(24, 26, 27, 0.25);
} }
@ -2034,16 +2034,6 @@ ul.problem-list {
#problem-table th a { #problem-table th a {
color: inherit; color: inherit;
} }
.problem-feed-option-item {
background-image: initial;
background-color: rgb(49, 53, 55);
color: rgb(152, 143, 129);
}
.problem-feed-option-item.active {
background-image: initial;
background-color: rgb(27, 73, 88);
color: rgb(121, 170, 255);
}
.problem-data-form .bad-file input, .problem-data-form .bad-file input,
.problem-data-form .bad-file .select2-selection { .problem-data-form .bad-file .select2-selection {
border-color: rgb(179, 0, 0); border-color: rgb(179, 0, 0);
@ -2479,9 +2469,10 @@ input[type="text"]:focus, input[type="password"]:focus {
.tabs > ul > li.active > span:hover, .tabs > ul > li.active > span:hover,
.tabs > ul > li.active > a, .tabs > ul > li.active > a,
.tabs > ul > li.active > span { .tabs > ul > li.active > span {
color: rgb(232, 230, 227); color: rgb(205, 200, 194);
background-color: rgb(24, 26, 27); border-bottom-color: rgb(126, 117, 103);
border-color: rgb(62, 68, 70) rgb(62, 68, 70) transparent; background-image: initial;
background-color: transparent;
} }
.tabs { .tabs {
border-bottom-color: rgb(62, 68, 70); border-bottom-color: rgb(62, 68, 70);
@ -2504,10 +2495,13 @@ input[type="text"]:focus, input[type="password"]:focus {
} }
.tabs > ul > li > a, .tabs > ul > li > a,
.tabs > ul > li > span { .tabs > ul > li > span {
border-color: transparent;
color: rgb(178, 172, 162); color: rgb(178, 172, 162);
text-decoration-color: initial; text-decoration-color: initial;
} }
.tabs > ul > li > a:hover,
.tabs > ul > li > span:hover {
border-bottom-color: rgb(0, 217, 0);
}
ul.pagination a:hover { ul.pagination a:hover {
color: rgb(232, 230, 227); color: rgb(232, 230, 227);
background-image: initial; background-image: initial;
@ -2585,17 +2579,15 @@ a.close:hover {
border-top-color: rgb(53, 57, 59); border-top-color: rgb(53, 57, 59);
} }
.sidebox h3 { .sidebox h3 {
background-image: initial;
background-color: rgb(24, 26, 27);
}
.sidebox h3 .fa {
background-image: initial; background-image: initial;
background-color: rgb(3, 66, 54); background-color: rgb(3, 66, 54);
color: rgb(232, 230, 227); color: rgb(232, 230, 227);
} }
.sidebox h3 .fa {
color: rgb(232, 230, 227);
}
.sidebox-content { .sidebox-content {
border-right-color: rgb(62, 68, 70);
border-bottom-color: rgb(62, 68, 70);
border-left-color: rgb(62, 68, 70);
border-top-color: initial; border-top-color: initial;
background-image: initial; background-image: initial;
background-color: rgb(24, 26, 27); background-color: rgb(24, 26, 27);
@ -3029,14 +3021,11 @@ a.voted {
border-bottom-color: initial; border-bottom-color: initial;
} }
} }
.info-pic {
border-color: rgb(62, 68, 70);
}
.info-circle { .info-circle {
stroke: rgb(232, 230, 227); stroke: rgb(232, 230, 227);
} }
#chat-info { #chat-info {
border-bottom-color: rgb(72, 78, 81); box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 3px;
} }
#refresh-button { #refresh-button {
background-image: initial; background-image: initial;
@ -3095,7 +3084,7 @@ a.voted {
color: rgb(232, 230, 227); color: rgb(232, 230, 227);
} }
.organization-row { .organization-row {
border-bottom-color: rgb(84, 91, 94); border-bottom-color: rgb(62, 68, 70);
border-top-color: initial; border-top-color: initial;
color: rgb(232, 230, 227); color: rgb(232, 230, 227);
} }
@ -3103,7 +3092,7 @@ a.voted {
background-color: rgb(31, 33, 35); background-color: rgb(31, 33, 35);
} }
.organization-container { .organization-container {
border-color: rgb(84, 91, 94); border-color: rgb(62, 68, 70);
} }
.ticket-container #content > h2:first-child small { .ticket-container #content > h2:first-child small {
color: rgb(168, 160, 149); color: rgb(168, 160, 149);

View file

@ -1,49 +1,50 @@
.leave-organization, .leave-organization:hover { .leave-organization, .leave-organization:hover {
color: red; color: red;
} }
#control-list li { #control-list li {
border-bottom: 1px solid black; border-bottom: 1px solid black;
} }
#pending-count-box { #pending-count-box {
float: right; float: right;
text-align: center; text-align: center;
background: red; background: red;
color: white; color: white;
border-radius: 3px; border-radius: 3px;
padding-left: 0.3em; padding-left: 0.3em;
padding-right: 0.3em; padding-right: 0.3em;
} }
.org-field-wrapper { .org-field-wrapper {
input[type=text], textarea { input[type=text], textarea {
width: 100%; width: 100%;
} }
.select2 { .select2 {
width: 100% !important; width: 100% !important;
} }
} }
.org-field-wrapper { .org-field-wrapper {
margin-top: 0.4em; margin-top: 0.4em;
} }
.org-field-wrapper:has(> input[type=checkbox]) { .org-field-wrapper:has(> input[type=checkbox]) {
display: contents; display: contents;
} }
.organization-row { .organization-row {
display: block; display: block;
padding: 0.5em; padding: 0.5em;
border-bottom: 1px gray solid; border-bottom: 1px #ccc solid;
border-top: none; border-top: none;
color: black; color: black;
font-weight: 500; font-weight: 500;
display: flex; display: flex;
align-items: center; align-items: center;
} }
.organization-row:hover { .organization-row:hover {
background-color: #f3f3f3; background-color: #f3f3f3;
} }
.organization-container { .organization-container {
border: 1px gray solid; border: 1px #ccc solid;
margin-bottom: 3em; margin-bottom: 3em;
border-radius: 5px;
} }

View file

@ -364,34 +364,10 @@ ul.problem-list {
} }
} }
.problem-feed-option {
width: 90%;
margin-left: 2.5%;
padding-bottom: 1em;
border-radius: 5px;
display: flex;
justify-content: space-between;
}
.problem-feed-option-item {
padding: 10px 15px;
border-radius: 1em;
font-weight: bold;
background: lightgray;
margin-right: 1em;
color: gray;
cursor: pointer;
}
.pcodecell { .pcodecell {
text-transform: uppercase; text-transform: uppercase;
} }
.problem-feed-option-item.active {
background: lightblue;
color: darkblue;
}
.problem-data-form { .problem-data-form {
.bad-file input, .bad-file .select2-selection { .bad-file input, .bad-file .select2-selection {
border-color: red; border-color: red;

View file

@ -90,4 +90,10 @@
#users-table th a { #users-table th a {
color: white; color: white;
}
.feed-table {
td, td:first-child, tr:last-child td, tr:last-child td:first-child {
border-width: 1px 0 0 0;
}
} }

View file

@ -215,12 +215,11 @@ input {
// Bootstrap-y tabs // Bootstrap-y tabs
.ul_tab_a_active { .ul_tab_a_active {
color: black; color: #045343;
cursor: default; cursor: default;
background-color: #fff; font-weight: bold;
border: 1px solid $border_gray; border-bottom: 3px solid #045343;
border-bottom-color: transparent; background: transparent;
border-image: none;
} }
.tabs { .tabs {
@ -267,7 +266,6 @@ input {
overflow-y: hidden; overflow-y: hidden;
> li { > li {
margin-bottom: -1px;
position: relative; position: relative;
display: block; display: block;
@ -284,16 +282,19 @@ input {
} }
> a, > span { > a, > span {
margin-right: 2px; margin-right: 10px;
line-height: 1.42857; line-height: 1.42857;
border: 1px solid transparent;
border-radius: $widget_border_radius $widget_border_radius 0 0;
position: relative; position: relative;
display: block; display: block;
padding: 10px 15px; padding: 5px 5px;
color: #555; color: #555;
text-decoration: none; text-decoration: none;
white-space: nowrap; white-space: nowrap;
font-weight: bold;
&:hover {
border-bottom: 3px solid green;
}
} }
} }
} }
@ -474,28 +475,30 @@ ul.select2-selection__rendered {
} }
.sidebox h3 { .sidebox h3 {
margin: 0 -5px;
background: #045343;
border-radius: $widget_border_radius $widget_border_radius 0 0; border-radius: $widget_border_radius $widget_border_radius 0 0;
color: white; padding-top: 10px;
padding-top: 5px; padding-bottom: 10px;
padding-bottom: 5px;
padding-left: 7px; padding-left: 7px;
font-size: 1.3em; font-size: 1.3em;
} font-weight: bold;
background: white;
display: flex;
.sidebox h3 .fa { .fa {
color: white; background: #045343;
float: right; color: white;
margin: 0.2em 0.4em 0 0; padding: 4px;
margin-right: 8px;
border-radius: 5px;
font-size: smaller;
}
} }
.sidebox-content { .sidebox-content {
border: 1px solid $border_gray;
border-top: none; border-top: none;
margin: 0 -5px;
padding: 1px 0.5em 3px; padding: 1px 0.5em 3px;
background: white; background: white;
border-radius: 0 0 $widget_border_radius $widget_border_radius;
&.sidebox-table { &.sidebox-table {
border: none; border: none;
@ -510,8 +513,7 @@ ul.select2-selection__rendered {
.sidebox { .sidebox {
border-top-left-radius: $widget_border_radius; border-top-left-radius: $widget_border_radius;
border-top-right-radius: $widget_border_radius; border-top-right-radius: $widget_border_radius;
padding: 0 5px !important; margin-bottom: 1.5em;
margin-bottom: 1.5em !important;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
} }

View file

@ -331,7 +331,6 @@
<noscript> <noscript>
<div id="noscript">{{ _('This site works best with JavaScript enabled.') }}</div> <div id="noscript">{{ _('This site works best with JavaScript enabled.') }}</div>
</noscript> </noscript>
<br>
<main id="content" class="{{'wrapper' if layout != 'no_wrapper'}}"> <main id="content" class="{{'wrapper' if layout != 'no_wrapper'}}">
{% block title_row %} {% block title_row %}
<h2 class="title-row"> <h2 class="title-row">

View file

@ -582,13 +582,8 @@
<div id="chat-container"> <div id="chat-container">
<div id="chat-online" class="chat-right-panel sidebox"> <div id="chat-online" class="chat-right-panel sidebox">
<h3 style="display:flex"> <h3>
{{_('Online Users')}} <i class="fa fa-users"></i>{{_('Online Users')}}
<a href="#" id="refresh-button" title="{{_('Refresh')}}">
<img src="/reload.png"
width="100%"
>
</a>
</h3> </h3>
<div id="chat-online-content"> <div id="chat-online-content">
<div id="search-container"> <div id="search-container">
@ -606,7 +601,7 @@
</div> </div>
</div> </div>
<div id="chat-area" class="chat-left-panel" style="width:100%"> <div id="chat-area" class="chat-left-panel" style="width:100%">
<div id="chat-info" style="height: 8%"> <div id="chat-info" style="height: 10%">
{% include 'chat/user_online_status.html' %} {% include 'chat/user_online_status.html' %}
</div> </div>
<div id="chat-box"> <div id="chat-box">

View file

@ -4,7 +4,7 @@
} }
#content { #content {
margin: 2.5em 1em 0 0; padding-top: 0;
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
@ -92,7 +92,6 @@
} }
.sidebox h3 { .sidebox h3 {
border-radius: 0; border-radius: 0;
margin: -1px -5.5px 0 -5.8px;
} }
.body-block { .body-block {
border-radius: 4px; border-radius: 4px;

View file

@ -1,7 +1,7 @@
{% if other_user %} {% if other_user %}
<div class="status-container" style="height: 100%"> <div class="status-container" style="height: 100%">
<img src="{{ gravatar(other_user.user, 135) }}" class="info-pic"> <img src="{{ gravatar(other_user.user, 135) }}" class="info-pic">
<svg style="position:absolute; height:100%; width: 110%"> <svg style="position:absolute; height:100%; width: 100%">
<circle class="info-circle" <circle class="info-circle"
fill="{{'green' if other_online else 'red'}}"/> fill="{{'green' if other_online else 'red'}}"/>
</svg> </svg>
@ -9,9 +9,9 @@
{% endif %} {% endif %}
<span class="info-name username"> <span class="info-name username">
{% if other_user %} {% if other_user %}
<a href="{{url('user_page', other_user)}}">{{other_user.user.username}}</a> {{link_user(other_user)}}
{% else%} {% else%}
<a href="#" style="margin-left: 3em">{{ _('Lobby') }}</a> {{ _('Lobby') }}
{% endif %} {% endif %}
</span> </span>
<span class="spacer"></span> <span class="spacer"></span>

View file

@ -1,6 +1,6 @@
{% if current_contests %} {% if current_contests %}
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('Ongoing contests') }} <i class="fa fa-trophy"></i></h3> <h3><i class="fa fa-trophy"></i> {{ _('Ongoing contests') }}</h3>
<div class="sidebox-content"> <div class="sidebox-content">
{% for contest in current_contests %} {% for contest in current_contests %}
<div class="contest"> <div class="contest">
@ -18,7 +18,7 @@
{% if future_contests %} {% if future_contests %}
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('Upcoming contests') }} <i class="fa fa-trophy"></i></h3> <h3><i class="fa fa-trophy"></i>{{ _('Upcoming contests') }}</h3>
<div class="sidebox-content"> <div class="sidebox-content">
{% for contest in future_contests %} {% for contest in future_contests %}
<div class="contest"> <div class="contest">

View file

@ -44,7 +44,7 @@
{% include "blog/content.html" %} {% include "blog/content.html" %}
{% else %} {% else %}
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('About') }}<i class="fa fa-info-circle"></i></h3> <h3><i class="fa fa-info-circle"></i>{{ _('About') }}</h3>
<div class="sidebox-content"> <div class="sidebox-content">
<div style="margin: 0.3em;"> <div style="margin: 0.3em;">
{% cache 3600 'organization_html' organization.id MATH_ENGINE %} {% cache 3600 'organization_html' organization.id MATH_ENGINE %}

View file

@ -4,8 +4,8 @@
{% endif %} {% endif %}
{% if can_edit or is_member %} {% if can_edit or is_member %}
<div id="control-panel" class="blog-sidebox sidebox no-dot-blog-sidebox"> <div id="control-panel" class="blog-sidebox sidebox no-dot-blog-sidebox">
<h3>{{ _('Controls') }} <i class="fa fa-cog"></i></h3> <h3><i class="fa fa-cog"></i>{{ _('Controls') }}</h3>
<ul id="control-list" class="sidebox-content" style="padding: 1em;"> <ul id="control-list" class="sidebox-content" style="margin: 0;">
{% if can_edit %} {% if can_edit %}
<li> <li>
<div> <div>
@ -67,7 +67,7 @@
</ul> </ul>
</div> </div>
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('About') }}<i class="fa fa-info-circle"></i></h3> <h3><i class="fa fa-info-circle"></i>{{ _('About') }}</h3>
<div class="sidebox-content"> <div class="sidebox-content">
<div style="margin: 0.3em;"> <div style="margin: 0.3em;">
{% cache 3600 'organization_html' organization.id MATH_ENGINE %} {% cache 3600 'organization_html' organization.id MATH_ENGINE %}

View file

@ -7,20 +7,20 @@
{% endblock %} {% endblock %}
{% block middle_content %} {% block middle_content %}
<div class="problem-feed-option"> <div class="tabs tabs-no-flex" style="width: 90%;margin-left: auto;margin-right: auto;">
<a href="{{url('problem_feed')}}" <ul>
class="button small {{'btn-midnightblue' if feed_type=='for_you' else 'btn-gray'}}"> <li class="{{'active' if feed_type=='for_you'}}">
{{_('FOR YOU')}} <a href="{{url('problem_feed')}}">{{_('FOR YOU')}}</a>
</a> </li>
<a href="{{url('problem_feed_new')}}" class="button small {{'btn-midnightblue' if feed_type=='new' else 'btn-gray'}}"> <li class="{{'active' if feed_type=='new'}}">
{{_('NEW')}} <a href="{{url('problem_feed_new')}}">{{_('NEW')}}</a>
</a> </li>
{% if request.user.has_perm('judge.suggest_problem_changes') %} {% if request.user.has_perm('judge.suggest_problem_changes') %}
<a href="{{url('problem_feed_volunteer')}}" <li class="{{'active' if feed_type=='volunteer'}}">
class="button small {{'btn-midnightblue' if feed_type=='volunteer' else 'btn-gray'}}"> <a href="{{url('problem_feed_volunteer')}}">{{_('VOLUNTEER')}}</a>
{{_('VOLUNTEER')}} </li>
</a> {% endif %}
{% endif %} </ul>
</div> </div>
{% if request.user.has_perm('judge.suggest_problem_changes') and feed_type == 'volunteer' %} {% if request.user.has_perm('judge.suggest_problem_changes') and feed_type == 'volunteer' %}
<ul style="margin-bottom: 1em; margin-left: auto"> <ul style="margin-bottom: 1em; margin-left: auto">

View file

@ -1,7 +1,6 @@
{% if last_attempted_problems%} {% if last_attempted_problems%}
<div class="sidebox"> <div class="sidebox">
<h3>{{ _('Last unsolved') }} <i class="fa fa-bullseye"></i> <h3><i class="fa fa-bullseye"></i>{{ _('Last unsolved') }}</h3>
</h3>
<div class="sidebox-content" style="padding: 0; border: 0"> <div class="sidebox-content" style="padding: 0; border: 0">
<table class="table feed-table"> <table class="table feed-table">
<tbody> <tbody>

View file

@ -1,6 +1,5 @@
<div class="sidebox"> <div class="sidebox">
<h3>{{ _('Problem search') }} <i class="fa fa-search"></i> <h3><i class="fa fa-search"></i>{{ _('Problem search') }}</h3>
</h3>
<div class="sidebox-content"> <div class="sidebox-content">
<form id="filter-form" name="form" action="" method="get"> <form id="filter-form" name="form" action="" method="get">
<div> <div>

View file

@ -15,7 +15,7 @@
{% if recent_organizations %} {% if recent_organizations %}
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('Recent groups') }} <i class="fa fa-users"></i></h3> <h3><i class="fa fa-users"></i>{{ _('Recent groups') }}</h3>
<div class="toggled"> <div class="toggled">
{% for organization in recent_organizations %} {% for organization in recent_organizations %}
<a href="{{ url('organization_home', organization.organization.pk, organization.organization.slug) }}" class="sidebox-content organization-row" title="{{organization.organization.about}}"> <a href="{{ url('organization_home', organization.organization.pk, organization.organization.slug) }}" class="sidebox-content organization-row" title="{{organization.organization.about}}">

View file

@ -331,7 +331,7 @@
<div class="right-sidebar"> <div class="right-sidebar">
<div class="submission"> <div class="submission">
<div class="sidebox"> <div class="sidebox">
<h3>{{ _('Filter submissions') }} <i class="fa fa-search"></i></h3> <h3><i class="fa fa-search"></i>{{ _('Filter submissions') }}</h3>
<div class="sidebox-content"> <div class="sidebox-content">
<form id="filter-form" name="form" action="" method="get"> <form id="filter-form" name="form" action="" method="get">
<div class="filter-form-group"> <div class="filter-form-group">
@ -360,7 +360,7 @@
</div> </div>
<div class="sidebox"> <div class="sidebox">
<div id="statistics-table"> <div id="statistics-table">
<h3>{{ _('Statistics') }} <i class="fa fa-pie-chart"></i></h3> <h3><i class="fa fa-pie-chart"></i>{{ _('Statistics') }}</h3>
<div class="sidebox-content"> <div class="sidebox-content">
<div id="status-graph"> <div id="status-graph">
<canvas width="230" height="170"></canvas> <canvas width="230" height="170"></canvas>

View file

@ -96,7 +96,7 @@
} }
function registerNavigation() { function registerNavigation() {
const links = ['.pagination a', '.tabs li a', '.problem-feed-option a']; const links = ['.pagination a', '.tabs li a'];
for (link of links) { for (link of links) {
$(link).on('click', function (e) { $(link).on('click', function (e) {
e.preventDefault(); e.preventDefault();

View file

@ -1,6 +1,6 @@
{% if top_rated %} {% if top_rated %}
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('Top Rating') }} <i class="fa fa-trophy"></i></h3> <h3><i class="fa fa-trophy"></i>{{ _('Top Rating') }}</h3>
<div class="sidebox-content" style="padding: 0; border: 0"> <div class="sidebox-content" style="padding: 0; border: 0">
<table class="table feed-table"> <table class="table feed-table">
<tbody> <tbody>
@ -19,7 +19,7 @@
{% if top_scorer %} {% if top_scorer %}
<div class="blog-sidebox sidebox"> <div class="blog-sidebox sidebox">
<h3>{{ _('Top Score') }} <i class="fa fa-trophy"></i></h3> <h3><i class="fa fa-trophy"></i>{{ _('Top Score') }}</h3>
<div class="sidebox-content" style="padding: 0; border: 0"> <div class="sidebox-content" style="padding: 0; border: 0">
<table class="table feed-table"> <table class="table feed-table">
<tbody> <tbody>