Add leaderboard

content/_index.md

@@ -13,6 +13,10 @@
 	</a>
 </p>
 
+<h2 style="text-align: center; margin: 0">:trophy: Leaderboard</h2>
+
+{{< leaderboard >}}
+
 Welcome to the Tegaki Tuesday website!
 
 Tegaki Tuesday is a weekly Japanese/English handwriting challenge that happens every, you guessed it, Tuesday. For each challenge, a short passage along with its translation is selected from a haiku, the lyrics of a song, or a passage from a book, and posted to this site.

layouts/shortcodes/.gitignore

@@ -0,0 +1 @@
+leaderboard.html

themes/tegakituesday.com/static/css/style.css

@@ -82,8 +82,8 @@ body {
 	overflow: hidden;
 	font-size: 1.25em;
 	overflow: hidden;
-	color: #ebdbb2;
+	color: var(--gb-dm-fg1);
-	background: #3c3836;
+	background: var(--gb-lm-fg1);
 }
 
 h1, h2, h3, h4, h5, h6, b, strong, th {
@@ -131,7 +131,7 @@ h1, h2, h3, h4, h5, h6, b, strong, th {
 }
 
 #content > div:last-child {
-	background: #3c3836;
+	background: var(--gb-dm-bg1);
 	width: 100%;
 	--heading-rule-color: var(--gb-dm-bg2);
 }
@@ -473,4 +473,28 @@ p, ul, ol {
 
 h1:first-child {
 	margin-top: 0;
+}
+
+#leaderboard {
+	margin: auto;
+}
+
+#leaderboard td, #leaderboard th {
+	padding: 0.125em;
+}
+
+#leaderboard th {
+	text-align: left;
+}
+
+#leaderboard a {
+	color: var(--gb-dm-fg1);
+}
+
+#leaderboard img {
+	height: 1.5em;
+}
+
+.muted {
+	color: var(--gb-dm-fg4);
 }