Added basic games handling

1 files changed, 41 insertions, 21 deletions

diff --git a/static/index.css b/static/index.css
index f5ef0b9..afb1c33 100644
--- a/static/index.css
+++ b/static/index.css
@@ -8,7 +8,7 @@ aside {
 }
 
 body {
-	background: #126623;
+	background: #358a46;
 	display: grid;
 	grid-template-rows: auto 1fr auto;
 	font-family: -apple-system, BlinkMacSystemFont,
@@ -50,11 +50,12 @@ header nav ul li {
 	text-decoration: none;
 }
 header nav ul li a {
-	color: #b58900;
+	color: black;
 	display: block;
 	text-decoration: none;
 }
 header nav ul li.nav-menu-title {
+	background: #126623;
 	float: left;
 	text-transform: uppercase;
 	font-weight: 700;
@@ -68,50 +69,69 @@ form input {
 }
 
 main {
-	margin-left: auto;
-	margin-right: auto;
+	background: #126623;
+	padding-left: 1em;
+	padding-right: 1em;
 }
 
-td {
-	background: #47b75e;
-	border: 1px solid #d4fcdb;
-	min-width: 27px;
-	height: 27px;
-	text-align: center;
+#games {
+	border-collapse: collapse;
+}
+#games tr:nth-child(even){background-color: #f2f2f2;}
+#games tr:hover {background-color: #ddd;}
+#games td, #games th {
+  border: 1px solid #ddd;
+  padding: 8px;
+}
+#games th {
+  padding-top: 12px;
+  padding-bottom: 12px;
+  text-align: left;
+  background-color: #04AA6D;
+  color: white;
 }
 
-#board {
-	border-collapse: collapse;
-	font-weight: bold;
+#remaining_letters {
 	max-width: 405px;
 }
 
+#rack-area {
+	max-width: 405px;
+}
 #rack {
 	display:inline-block;
 	font-weight: bold;
 }
-
-#remaining_letters {
+#board {
+	border-collapse: collapse;
+	font-weight: bold;
 	max-width: 405px;
 }
+#board tr td, #rack tr td {
+	background: #47b75e;
+	border: 1px solid #d4fcdb;
+	min-width: 27px;
+	height: 27px;
+	text-align: center;
+}
 
-.tw {
+#board tr td.tw {
 	background:#E60000;
 }
-.dw {
+#board tr td.dw {
 	background:#F86969;
 }
-.tl {
+#board tr td.tl {
 	background:#3675FA;
 }
-.dl {
+#board tr td.dl {
 	background:#22ACD8;
 }
-.start {
+#board tr td.start {
 	background:#ff5500;
 }
 
-.letter {
+#board tr td.letter, #rack tr td.letter {
 	background:#f3e797;
 }
 .placed {