From 31f2ded7a0e0d739a34529b9b24f7a58090a3036 Mon Sep 17 00:00:00 2001
From: Evan <me@evanzhang.ca>
Date: Sun, 5 Feb 2023 13:20:01 -0500
Subject: [PATCH] Clean up contest ranking CSS and add dark mode colours

---
 resources/contest.scss      | 33 +++++++++++++++------------------
 resources/vars-dark.scss    |  2 ++
 resources/vars-default.scss |  2 ++
 3 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/resources/contest.scss b/resources/contest.scss
index 838671fd9..9c66c46f2 100644
--- a/resources/contest.scss
+++ b/resources/contest.scss
@@ -188,8 +188,13 @@ form.contest-join-pseudotab {
 }
 
 #ranking-table {
-    .username {
+    .user-name {
         min-width: 20em;
+        position: relative;
+    }
+
+    .userinfo a, .user-name a, .user-name form {
+        display: inline-block !important;
     }
 
     .rating-column {
@@ -198,25 +203,21 @@ form.contest-join-pseudotab {
 
     td {
         height: 2.5em;
+
+        a:hover {
+            text-decoration: underline;
+        }
     }
 
     a {
         display: block;
     }
 
-    .userinfo a, .user-name a, .user-name form {
-        display: inline-block !important;
-    }
-
     /* Make problem table headers green on hover */
     th a:hover {
         color: #0F0;
     }
 
-    td a:hover {
-        text-decoration: underline;
-    }
-
     .rank {
         min-width: 2.5em
     }
@@ -226,7 +227,7 @@ form.contest-join-pseudotab {
     }
 
     .disqualified {
-        background-color: #ffa8a8 !important;
+        background-color: $color_contest_ranking_disqualified !important;
     }
 
     .full-score, .full-score a {
@@ -259,18 +260,18 @@ form.contest-join-pseudotab {
 
     .user-points, .user-points a {
         font-weight: bold;
-        color: black;
+        color: $color_primary100;
     }
 
     .solving-time {
-        color: gray;
+        color: $color_primary50;
         font-weight: normal;
         font-size: 0.75em;
         padding-bottom: -0.75em;
     }
 
     .point-denominator {
-        border-top: 1px solid gray;
+        border-top: 1px solid $color_primary50;
         font-size: 0.7em;
     }
 
@@ -278,17 +279,13 @@ form.contest-join-pseudotab {
         display: none;
     }
 
-    .user-name {
-        position: relative;
-    }
-
     .organization-column {
         display: none;
         text-align: left !important;
         border-right: none !important;
 
         a {
-            color: gray !important;
+            color: $color_primary50;
             font-weight: 600;
         }
     }
diff --git a/resources/vars-dark.scss b/resources/vars-dark.scss
index 07d24e5cf..e35edd383 100644
--- a/resources/vars-dark.scss
+++ b/resources/vars-dark.scss
@@ -19,6 +19,8 @@ $color_link200: #d83;   // active
 $color_pageBg: #222;    // #222 because some elements should be darker than pageBg
 
 // custom one-off colours
+$color_contest_ranking_disqualified: #622;
+
 $color_rating_none: #aaa;
 $color_rating_newbie: #aaa;
 $color_rating_amateur: #00a900;
diff --git a/resources/vars-default.scss b/resources/vars-default.scss
index 619d50d0a..56ef63584 100644
--- a/resources/vars-default.scss
+++ b/resources/vars-default.scss
@@ -19,6 +19,8 @@ $color_link200: #faa700;    // active
 $color_pageBg: #fff;
 
 // custom one-off colours
+$color_contest_ranking_disqualified: #ffa8a8;
+
 $color_rating_none: #999;
 $color_rating_newbie: #999;
 $color_rating_amateur: #00a900;