From 176c08759933e1a186f10029a889633962ef2c8e Mon Sep 17 00:00:00 2001
From: Sorrel Bri <sorrel.bri.june@gmail.com>
Date: Sun, 12 Apr 2020 22:54:20 -0700
Subject: [PATCH] style RoomDetail component

---
 .../Display/RoomDetail/RoomDetail.scss        | 31 +++++++++++++++++++
 packages/play-node-go/src/index.scss          |  9 ++++++
 packages/play-node-go/src/pages/Home/Home.js  |  2 +-
 3 files changed, 41 insertions(+), 1 deletion(-)

diff --git a/packages/play-node-go/src/components/Display/RoomDetail/RoomDetail.scss b/packages/play-node-go/src/components/Display/RoomDetail/RoomDetail.scss
index 56d3ee4..007419a 100644
--- a/packages/play-node-go/src/components/Display/RoomDetail/RoomDetail.scss
+++ b/packages/play-node-go/src/components/Display/RoomDetail/RoomDetail.scss
@@ -1 +1,32 @@
 @import '../../../../public/stylesheets/partials/mixins';
+@import '../../../../public/stylesheets/partials/variables';
+
+div.RoomDetail {
+  display: grid;
+  grid-template-columns: [left] 1fr [right];
+  grid-template-rows: [top] 1fr [middle] 9fr [bottom];
+  height: 20vh;
+  padding: 1vw;
+  width: 20vh;
+
+  div.RoomDetail__arrow {
+    border-top: map-get($colors, 'home') solid 2vh;
+    border-left: white solid 1.5vh;
+    height: 0;
+  }
+
+  div.RoomDetail__data {
+    background-color: white;
+    height: 90%;
+    width: 100%;
+    padding: 1vh;
+    display: grid;
+    grid-template-rows: 2fr 3fr;
+
+    .RoomDetail__heading {
+      display: flex;
+      flex-flow: row wrap;
+      align-items: flex-start;
+    }
+  }
+}
\ No newline at end of file
diff --git a/packages/play-node-go/src/index.scss b/packages/play-node-go/src/index.scss
index 566ccfd..c8f02b7 100644
--- a/packages/play-node-go/src/index.scss
+++ b/packages/play-node-go/src/index.scss
@@ -46,6 +46,15 @@ code {
     monospace;
 }
 
+h3 {
+  font-size: 140%;
+  font-weight: 600;
+}
+
+h4 {
+  font-size: 110%;
+}
+
 a:hover, a:active {
   text-decoration: underline;
 }
\ No newline at end of file
diff --git a/packages/play-node-go/src/pages/Home/Home.js b/packages/play-node-go/src/pages/Home/Home.js
index 1ef7225..4580fe9 100644
--- a/packages/play-node-go/src/pages/Home/Home.js
+++ b/packages/play-node-go/src/pages/Home/Home.js
@@ -8,7 +8,7 @@ import Loading from '../../components/Display/Loading/Loading';
 const Home = props => {
   const state =     props.state || {};
   const dispatch =  props.dispatch;
-  const [ roomDetail, setRoomDetail ] = useState(0);
+  const [ roomDetail, setRoomDetail ] = useState(1);
 
   const showRoomDetail = id => roomDetail === id ? setRoomDetail(0) : setRoomDetail(id);