Fix mobile UI

templates/contest/ranking-css.html

@@ -0,0 +1,185 @@
+<style>
+    #content-left {
+        overflow-x: auto;
+    }
+
+    #users-table .username {
+        min-width: 15em;
+    }
+
+    #users-table td {
+        height: 2.5em;
+    }
+
+    #users-table a {
+        display: block;
+    }
+
+    .userinfo a, .user-name a, .user-name form {
+        display: inline !important;
+    }
+
+    #users-table th a, #users-table th a:link, #users-table th a:visited {
+        color: white;
+    }
+
+    #users-table th a:hover {
+        color: #0F0;
+    }
+
+    #users-table td a:hover {
+        text-decoration: underline;
+    }
+
+    .first-solve {
+        background: #00f9a1;
+    }
+
+    .rank {
+        min-width: 2.5em
+    }
+
+    .points {
+        min-width: 2.5em;
+    }
+
+    .disqualified {
+        background-color: #ffa8a8 !important;
+    }
+
+    .full-score, .full-score a {
+        font-weight: bold;
+        color: green;
+    }
+
+    .partial-score, .partial-score a {
+        color: green;
+    }
+
+    .failed-score, .failed-score a {
+        font-weight: bold;
+        color: red;
+    }
+
+    .pretest-full-score, .pretest-full-score a {
+        font-weight: bold;
+        color: #2980b9;
+    }
+
+    .pretest-partial-score, .pretest-partial-score a {
+        color: #2980b9;
+    }
+
+    .pretest-failed-score, .pretest-failed-score a {
+        font-weight: bold;
+        color: red;
+    }
+
+    .user-points {
+        font-weight: bold;
+        color: black;
+    }
+
+    .solving-time {
+        color: gray;
+        font-weight: normal;
+        font-size: 0.75em;
+        padding-bottom: -0.75em;
+    }
+
+    .point-denominator {
+        border-top: 1px solid gray;
+        font-size: 0.7em;
+    }
+
+    .start-time {
+        display: none;
+    }
+
+    .user-name {
+        position: relative;
+    }
+
+    .organization-column {
+        display: none;
+        text-align: left !important;
+        border-right: none !important;
+    }
+
+    .organization-column a {
+        color: gray !important;
+        font-weight: 600;
+    }
+
+    .fullname-column {
+        text-align: right !important;
+        border-right: none !important;
+    }
+
+    .fullname-column span {
+        color: gray !important;
+        font-weight: 600;
+    }
+
+    .featherlight-content {
+        border-radius: 10px;
+        height: 80%;
+        width:  60%;
+        overflow: auto;
+    }
+
+    .select2-selection__arrow {
+        display: none;
+    }
+
+    .select2-selection__rendered {
+        cursor: text;
+        overflow: initial !important
+    }
+
+    .select2-results__option--highlighted {
+        background-color: #DEDEDE !important;
+    }
+
+    .select2-results__option {
+        white-space: nowrap;
+    }
+
+    #search-contest, #search-contest + .select2 {
+        margin-top: 0.5em;
+    }
+
+    #search-contest {
+        width: 200px;
+        height: 2.3em;
+    }
+    html.with-featherlight {
+        overflow: unset;
+    }
+    
+    @media (max-width: 799px) {
+        .featherlight-content {
+            width:  95%;
+        }
+        #users-table .username {
+            min-width: fit-content;
+        }
+    }
+</style>
+
+{% if has_rating %}
+    <style>#users-table .rate-box {
+        font-size: 0.85em;
+        float: left;
+    }
+
+    #users-table td:nth-child(1) .rating {
+        margin-left: 1.25em;
+        display: block;
+    }
+
+    #users-table td:nth-child(2) a {
+        display: block;
+    }
+    </style>
+{% endif %}