HW5-Sutong Jiang

assignment/README.md

@@ -14,3 +14,6 @@ Use [Figma](https://www.figma.com) to recreate the design from one of the list o
 - Don't worry about replicating logos and other images. But try to replicate colors and components (dropdowns, search inputs, buttons) as closely as you can
 - See how far you can get in 3 hours and then feel free to stop, or keep going if you're having fun
 - Using Figma, share your project with Nathan and Jeff ([email protected])
+
+### HW Address
+https://www.figma.com/file/BRQ52AFPwU9g9sPYeN456TUf/Jiang_globalForestWatch?node-id=0%3A1

lab/css/style.css

@@ -10,10 +10,20 @@ body {
     font-family: helvetica, arial, sans-serif;
 }
 
+.header {
+    position: relative;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 40px;
+    z-index: 2;
+    background-color: #000
+}
+
 .map {
     background-color: #eee;
-    position: absolute;
-    left: 400px;
+    position: relative;
+    left: 300px;
     right: 0;
     bottom: 0;
     top: 0;
@@ -23,9 +33,9 @@ body {
     overflow-y: auto; /* This line allows the sidebar to scroll when there is
                          a lot of content in it */
     background-color: #ccc;
-    position: absolute;
+    position: relative;
     left: 0;
-    width: 400px;
+    width: 300px;
     bottom: 0;
     top: 0;
 }