From 761e2b5c0526987b8a56c52b2b11e2ed99e37396 Mon Sep 17 00:00:00 2001
From: Kjetil Orbekk <kj@orbekk.com>
Date: Wed, 7 Sep 2022 21:38:55 -0400
Subject: Start working on game layout

---
 webapp/src/default.css | 46 +++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 41 insertions(+), 5 deletions(-)

(limited to 'webapp/src/default.css')

diff --git a/webapp/src/default.css b/webapp/src/default.css
index bfc6872..2bfc862 100644
--- a/webapp/src/default.css
+++ b/webapp/src/default.css
@@ -4,10 +4,48 @@ body {
     background-color: #eeb;
 }
 
+*{
+  box-sizing: border-box;
+  padding: 0;
+  margin: 0;
+}
+
+.app {
+    display: grid;
+    grid-template-areas: ".    north  ."
+                         "west center east"
+                         ".    south  .";
+    grid-template-rows: 80px 1fr 80px;
+    grid-template-columns: 80px 1fr 80px;
+    width: 100%;
+    height: 100%;
+}
+
+.west {
+    grid-area: west;
+    transform: rotate(90deg);
+}
+.north {
+    grid-area: north;
+    transform: rotate(180deg);
+}
+.east {
+    grid-area: east;
+    transform: rotate(270deg);
+}
+.south {
+    grid-area: south;
+}
+.center {
+    grid-area: center;
+    display: grid;
+    justify-content: center;
+}
+
 .hand {
-    display: flex;
-    flex-direction: row;
-    /* transform: rotate(90deg); */
+    display: grid;
+    justify-content: center;
+    grid-auto-flow: column;
 }
 
 .hand .card {
@@ -33,8 +71,6 @@ body {
 }
 
 .card div {
-    display: flex;
-    flex-direction: column;
     text-align: center;
 }
 
-- 
cgit v1.2.3