chore: updating world map workshop prototype

.gitignore

@@ -1,4 +1,4 @@
-# Libraries 
+# Libraries
 node_modules/
 
 # Parcel projects
@@ -8,3 +8,5 @@ node_modules/
 dist/
 
 .DS_Store
+
+.vscode/

front-end-libraries/learn-intermediate-d3-by-building-a-map-of-earth/index.css

@@ -22,4 +22,4 @@ svg:active {
 
 .label {
   color: #0050A1;
-}
+}

front-end-libraries/learn-intermediate-d3-by-building-a-map-of-earth/index.html

@@ -30,4 +30,4 @@ <h1>D3 Map of World Population</h1>
     <!-- Script with D3 code -->
     <script type="text/javascript" src="./index.js"></script>
   </body>
-</html>
+</html>

front-end-libraries/learn-intermediate-d3-by-building-a-map-of-earth/index.js

@@ -177,4 +177,4 @@ Promise.all([getJSONData, getCSVData]).then(function(values) {
       .tickFormat(i => format(color.domain()[i - 1])))
     .select(".domain")
       .remove();
-});
+});

front-end-libraries/learn-intermediate-d3-by-building-a-map-of-earth/styles.css

@@ -0,0 +1,25 @@
+svg {
+  background-color: #ADD8E6;
+  cursor: grab;
+}
+
+svg:active {
+  cursor: grabbing;
+}
+
+.countries {
+  stroke: #fff;
+}
+
+.tooltip {
+  position: absolute;
+  padding: 10px;
+  color: #fff;
+  background-color: #b8b8b8;
+  opacity: 0;
+  border-radius: 5px;
+}
+
+.label {
+  color: #0050A1;
+}