From d2a9bed4da6cbd60e6693217395c209f5db8e863 Mon Sep 17 00:00:00 2001
From: Evan Burkey <evan@burkey.co>
Date: Fri, 24 Jan 2025 15:28:27 -0800
Subject: [PATCH] add the lords

---
 app/assets/stylesheets/application.css | 42 +++++++++++++++++++++++++-
 app/views/leaderboard/index.html.erb   | 13 ++++++++
 2 files changed, 54 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css
index 5882ebb..b2723fc 100644
--- a/app/assets/stylesheets/application.css
+++ b/app/assets/stylesheets/application.css
@@ -105,10 +105,11 @@ body {
 }
 
 h1 {
-    color: #ebdbd2;
+    color: #fe8019;
     margin: auto;
     text-align: center;
     padding-top: 10px;
+    padding-bottom: 1em;
 }
 
 a {
@@ -117,4 +118,43 @@ a {
 
 a:visited {
     color: #b16286;
+}
+
+.throne {
+    display: flex;
+    justify-content: center; /* Centers the throne-boxes within the throne div */
+    gap: 20px; /* Adds padding between the two throne-box divs */
+    color: #ebdbd2;
+}
+
+.throne-box {
+    flex: 1;
+    border: 1px solid #928374;
+    padding: 10px 10px 0;
+    text-align: center;
+    max-width: 360px;
+}
+
+.throne-title {
+    margin-top: 10px;
+    margin-bottom: 10px; /* Adds space below the title */
+    font-size: 1.5em; /* Adjust title font size */
+}
+
+.gambalord {
+    color: #fabd2f;
+}
+
+.gumbalord {
+    color: #fb4934;
+}
+
+.throne-name {
+    margin-bottom: 5px; /* Adds space below the name */
+    font-size: 1.3em; /* Adjust name font size */
+}
+
+.throne-purse {
+    margin-top: 10px;
+    font-size: 1.1em; /* Adjust purse font size */
 }
\ No newline at end of file
diff --git a/app/views/leaderboard/index.html.erb b/app/views/leaderboard/index.html.erb
index 466a90d..216ecc2 100644
--- a/app/views/leaderboard/index.html.erb
+++ b/app/views/leaderboard/index.html.erb
@@ -1,5 +1,18 @@
 <h1>Force Kin Gamba Leaderboard</h1>
 
+<div class="throne">
+  <div class="throne-box">
+    <h3 class="throne-title gambalord">Gambalord</h3>
+    <h4 class="throne-name"><%= @players.first.name %></h4>
+    <h5 class="throne-purse"><%= @players.first.purse %></h5>
+  </div>
+  <div class="throne-box">
+    <h3 class="throne-title gumbalord">Gumbalord</h3>
+    <h4 class="throne-name"><%= @players.last.name %></h4>
+    <h5 class="throne-purse"><%= @players.last.purse %></h5>
+  </div>
+</div>
+
 <% if @players.any? %>
 <div class="wrapper">
   <div class="table">