Add initial content, styles and variables

index.html

@@ -7,6 +7,12 @@
     <link rel="stylesheet" href="style.css">
 </head>
 <body>
+    <h1>Etch-A-Sketch</h1>
+    <div class="area">
+        <div class="container">
+
+        </div>
+    </div>
     
 
     <script src="script.js"></script>

script.js

@@ -0,0 +1,7 @@
+const container = document.querySelector(".container");
+const conWidth = container.clientWidth;
+const conHeight = container.clientHeight
+const grid = document.createElement("div");
+let numGrid = 16;
+const gridWidth = conWidth / numGrid;
+const gridHeight = conHeight / numGrid;

style.css

@@ -0,0 +1,15 @@
+body{
+    background-color: #333;
+    color: #eee
+}
+.area{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 90vh;
+}
+.container{
+    border: 1px solid #eee;
+    height: 500px;
+    width: 500px;
+}