Make judges in problem page togglable

locale/vi/LC_MESSAGES/django.po

@@ -4750,7 +4750,7 @@ msgstr[0] "Máy chấm:"
 
 #: templates/problem/problem.html:351
 msgid "none available"
-msgstr "không có sẵn"
+msgstr "Bài này chưa có máy chấm"
 
 #: templates/problem/problem.html:363
 #, python-format

templates/problem/problem.html

@@ -108,6 +108,10 @@
             if (window.location.href.includes('#comment')) {
                 $('#comment-announcement').click();
             }
+
+            {% if not available_judge %}
+                $('#judge-toggle').click();
+            {% endif %}
         });
     </script>
 {% endblock %}
@@ -330,14 +334,16 @@
     {% endif %}
     {% if problem.is_editable_by(request.user) %}
         <div id="available-judges">
-            <i class="fa fa-database fa-fw"></i><span
+            <div class="toggle closed" id="judge-toggle">
-                class="pi-name">{% trans trimmed count=available_judges|length %}
+                <i class="fa fa-chevron-right fa-fw"></i><span
-                Judge:
+                    class="pi-name">{% trans trimmed count=available_judges|length %}
-                {% pluralize count %}
+                    Judge:
-                Judges:
+                    {% pluralize count %}
-            {% endtrans %}
+                    Judges:
-            </span>
+                {% endtrans %}
-            <div class="pi-value judges-value">
+                </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 %}
@@ -348,7 +354,7 @@
                         {{ available_judges|join(", ") }}
                     {% endif %}
                 {% else %}
-                    <i>{{ _('none available') }}</i>
+                    <i style="color: red">{{ _('none available') }}</i>
                 {% endif %}
             </div>
         </div>