step1: add css grid

cgood92 · May 30, 2018 · 9498699 · 9498699
1 parent 155f995
commit 9498699
Showing 1 changed file with 18 additions and 1 deletion.
diff --git a/src/App.js b/src/App.js
@@ -5,7 +5,24 @@ import Main from "./components/Main";
 import LeftSidebar from "./components/LeftSidebar";
 import RightSidebar from "./components/RightSidebar";
 
-const appStyles = css({});
+const appStyles = css({
+  display: "grid",
+  gridTemplateColumns: "200px 1fr 200px",
+  gridTemplateRows: "auto 1fr",
+  gridTemplateAreas: `
+    "header header header"
+    "sidebarLeft main sidebarRight"
+  `,
+  minHeight: "100vh",
+  "& > header": {
+    gridArea: "header",
+    position: "sticky",
+    top: 0,
+  },
+  "& > *": {
+    border: "1px solid gray",
+  },
+});
 
 class App extends Component {
   render() {