From c670c8a1a23654c4aac031ea8cfa12d89e0426fa Mon Sep 17 00:00:00 2001
From: Elijah Steres <elijahsteres@gmail.com>
Date: Sun, 3 Jan 2021 15:09:31 -0500
Subject: [PATCH] css changes and add title field

---
 .DS_Store                 | Bin 0 -> 6148 bytes
 static/css/game.css       |  79 +++++++++++++++-----------------------
 static/css/games_page.css |  16 ++++----
 static/js/.DS_Store       | Bin 0 -> 6148 bytes
 templates/base.html       |   2 +-
 templates/game_box.html   |  13 +++----
 6 files changed, 46 insertions(+), 64 deletions(-)
 create mode 100644 .DS_Store
 create mode 100644 static/js/.DS_Store

diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6
GIT binary patch
literal 6148
zcmeH~Jr2S!425mzP>H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3
zem<@ulZcFPQ@L2!n>{z**<q8>++&mCkOWA81W14cNZ<zv;LbK1Poaz?KmsK2CSc!(
z0ynLxE!0092;Krf2c+FF_Fe*7ECH>lEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ
zLs35+`xjp>T0<F0fCPF1$Cyrb|F7^5{eNG?83~ZUUlGt@xh*qZDeu<Z%US-OSsOPv
j)R!Z4KLME7ReXlK;d!wEw5GODWMKRea10D2@KpjYNUI8I

literal 0
HcmV?d00001

diff --git a/static/css/game.css b/static/css/game.css
index d660f3c..01624c2 100644
--- a/static/css/game.css
+++ b/static/css/game.css
@@ -27,33 +27,23 @@
     background-color: var(--background-secondary);
     border-top-right-radius: 4px;
     height: max-content;
-    
+    display: flex;
+    justify-content: space-between
 }
 
-.inning {
-    float: left;
-    margin: 5px;
-    margin-left: 8px;
-}
-
-.weather {
-    float: right;
-    margin: 5px;
-    margin-right: 8px;
+.header > div {
+    margin: 0.3rem 0.5rem;
 }
 
 .body {
-    margin: 10px;
+    margin: 0.5rem;
     display: grid;
-    grid-template-columns: 66% 33%;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
     grid-template-areas:
-      "teams info" 
-      "players info" 
-      "update update";
-    grid-template-rows: 90px 85px;
-    grid-row-gap: 4px;
-    grid-column-gap: 14px;
-    flex: 1;
+      "teams teams info" "players players info" "update update update";
+    grid-template-rows: 5.5rem auto auto;
+    grid-row-gap: 0.5rem;
+    grid-column-gap: 0.75rem;
 }
 
 .teams {
@@ -70,7 +60,7 @@
     display: flex;
     justify-content: space-between;
     width: 100%;
-    margin: 5px 0px;
+    margin: 0.25rem 0rem;
 }
 
 .team_name {
@@ -86,8 +76,7 @@
     align-items: center;
     justify-content: space-around;
     background: #4f545c;
-    padding: 25px 0px;
-    margin-right: 10px;
+    padding: 0.75rem 0rem;
     border-radius: 4px;
 }
 
@@ -95,14 +84,14 @@
     font-size: 10pt;
     text-align: left;
     height: max-content;
-    padding: 5px;
+    margin: 0.3rem 0.5rem;
 }
 
 .leagueoruser {
     font-size: 10pt;
     text-align: right;
     height: max-content;
-    padding: 5px;
+    margin: 0.3rem 0.5rem;
 }
 
 .footer {
@@ -144,17 +133,22 @@
 
 .players {
     grid-area: players;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-around;
-    align-items: start;
+    display: grid;
+    grid-template-columns: auto minmax(0, 1fr);
+    grid-template-rows: auto auto;
+    grid-column-gap: 0.5rem;
+    margin-left: 0.3rem;
 }
 
-.player {
-    display: flex;
-    align-items: end;
-    width: 100%;
-    flex-direction: column;
+.players > div {
+    margin: 0.25rem 0rem;
+}
+
+.player_type {
+    text-align: end;
+    font-weight: bolder;
+    display: inline-block;
+    vertical-align: middle;
 }
 
 .player_name {
@@ -162,16 +156,13 @@
     text-overflow: ellipsis;
     text-align: start;
     white-space: nowrap;
-    width: 95%;
-    margin-top: -4px;
+    width: 100%;
 }
 
 .update {
     grid-area: update;
-    margin-right: 10px;
-    margin-top: 5px;
-    min-height: 50px;
-    padding: 0px 10px;
+    min-height: 3.5rem;
+    padding: 0rem 0.75rem;
     height: 100%;
     background: var(--background-secondary);
     border-radius: 4px;
@@ -180,14 +171,8 @@
     justify-content: start;
 }
 
-.player_type {
-    width: 100%;
-    text-align: start;
-    font-weight: bolder;
-}
-
 .update_emoji {
-    margin-right: 10px;
+    margin-right: 0.75rem;
     margin-left: 2px;
 }
 
diff --git a/static/css/games_page.css b/static/css/games_page.css
index d86bfdc..f95f077 100644
--- a/static/css/games_page.css
+++ b/static/css/games_page.css
@@ -8,7 +8,7 @@
 }
 
 .container > div {
-    min-height: 325px;
+    min-height: 298px;
 }
 
 #filters {
@@ -21,15 +21,15 @@
 }
 
 #filters > * {
-    padding: 4px 8px;
-    margin: 0px 8px;
+    padding: 0.25rem 0.5rem;
+    margin: 0rem 0.5rem;
     font-size: 16pt;
     background: rgba(0,0,0,0);
 }
 
 #filters > .filter {
-    border-radius: 8px;
-    min-width: 100px;
+    border-radius: 0.5rem;
+    min-width: 6.25rem;
     text-align: center;
     border: none;
     color: white;
@@ -45,14 +45,14 @@
     flex-direction: column;
     justify-content: center;
     width: 100%;
-    height: 75px;
+    height: 4.5rem;
 }
 
 #footer > div {
     text-align: center;
-    font-size: 20px;
+    font-size: 16pt;
     position: relative;
-    top: 5px;
+    top: 0.25rem;
 }
 
 .emptyslot {
diff --git a/static/js/.DS_Store b/static/js/.DS_Store
new file mode 100644
index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6
GIT binary patch
literal 6148
zcmeH~Jr2S!425mzP>H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3
zem<@ulZcFPQ@L2!n>{z**<q8>++&mCkOWA81W14cNZ<zv;LbK1Poaz?KmsK2CSc!(
z0ynLxE!0092;Krf2c+FF_Fe*7ECH>lEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ
zLs35+`xjp>T0<F0fCPF1$Cyrb|F7^5{eNG?83~ZUUlGt@xh*qZDeu<Z%US-OSsOPv
j)R!Z4KLME7ReXlK;d!wEw5GODWMKRea10D2@KpjYNUI8I

literal 0
HcmV?d00001

diff --git a/templates/base.html b/templates/base.html
index 9c8373a..19d0cce 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -23,7 +23,7 @@
             <a href="https://github.com/Sakimori/matteo-the-prestige" class="link" target="_blank" rel="noopener noreferrer">Github</a><br />
             <a href="https://twitter.com/intent/follow?screen_name=SIBR_XVI" class="link" target="_blank" rel="noopener noreferrer">Twitter</a>
         </div>
-        <h2 class="page_header" style="font-size: 50px;">THE SIMMADOME</h2>
+        <a href="/"><h2 class="page_header" style="font-size: 50px;">THE SIMMADOME</h2></a>
         <h2 class="page_header">Join SIBR on <a href="https://discord.gg/UhAajY2NCW" class="link"><img src="static/discord.png" height="30"></a> to start your own games!</h2>
     </div>
     {% block body %}{% endblock %}
diff --git a/templates/game_box.html b/templates/game_box.html
index 39e18b9..c4d1d1d 100644
--- a/templates/game_box.html
+++ b/templates/game_box.html
@@ -6,6 +6,7 @@ src={% if state.bases[number] %}"/static/img/base_filled.png" alt="{{state.bases
 {%- endmacro %}
 <div class="header">
     <div class="inning">Inning: {% if state.display_top_of_inning == true %}🔼{% else %}🔽{% endif %} {{ state.display_inning }}/{{ state.max_innings }}</div>
+    <div class="title">{{ state.title }}</div>
     <div class="weather">{{ state.weather_emoji }} {{ state.weather_text }}</div>
 </div>
 <div class="body">
@@ -36,14 +37,10 @@ src={% if state.bases[number] %}"/static/img/base_filled.png" alt="{{state.bases
         </div>
     </div>
     <div class="players">
-        <div class="player pitcher">
-            <div class="player_type">PITCHER</div>
-            <div class="player_name pitcher_name">{{ state.pitcher }}</div>
-        </div>
-        <div class="player batter">
-            <div class="player_type">BATTER</div>
-            <div class="player_name batter_name">{{ state.batter }}</div>
-        </div>
+        <div class="player_type">PITCHER</div>
+        <div class="player_name pitcher_name">{{ state.pitcher }}</div>
+        <div class="player_type">BATTER</div>
+        <div class="player_name batter_name">{{ state.batter }}</div>
     </div>
     <div class="update">
         <div class="update_emoji">{{ state.update_emoji }}</div>