Building column scrolls properly. Added more buildings + plural names

constants.js

@@ -8,33 +8,93 @@ const resourceTypes = {
 const buildings = {
   "micro": {
     "name": "Micro",
+    "plural": "Micros",
     "cost": 1e1,
-    "prod": 0.1
+    "prod": 1e-1/1
   },
   "anthro": {
     "name": "Anthro",
+    "plural": "Anthros",
     "cost": 1e2,
-    "prod": 2
+    "prod": 1e0/1.1
   },
   "car": {
     "name": "Car",
+    "plural": "Cars",
     "cost": 1e3,
-    "prod": 5
+    "prod": 1e1/1.2
   },
-  "train": {
-    "name": "Train",
+  "bus": {
+    "name": "Bus",
+    "plural": "Buses",
     "cost": 1e4,
-    "prod": 25
+    "prod": 1e2/1.3
   },
   "house": {
     "name": "House",
+    "plural": "Houses",
     "cost": 1e5,
-    "prod": 100
+    "prod": 1e3/1.4
   },
-  "universe": {
-    "name": "Universe",
+  "apartment": {
+    "name": "Apartment",
+    "plural": "Apartments",
+    "cost": 1e6,
+    "prod": 1e4/1.5
+  },
+  "block": {
+    "name": "Block",
+    "plural": "Blocks",
+    "cost": 1e7,
+    "prod": 1e5/1.6
+  },
+  "town": {
+    "name": "Town",
+    "plural": "Towns",
+    "cost": 1e8,
+    "prod": 1e6/1.7
+  },
+  "city": {
+    "name": "City",
+    "plural": "Cities",
+    "cost": 1e9,
+    "prod": 1e7/1.8
+  },
+  "metro": {
+    "name": "Metropolis",
+    "plural": "Metropolises",
+    "cost": 1e10,
+    "prod": 1e8/1.9
+  },
+  "county": {
+    "name": "County",
+    "plural": "Counties",
+    "cost": 1e11,
+    "prod": 1e9/2
+  },
+  "state": {
+    "name": "State",
+    "plural": "States",
+    "cost": 1e12,
+    "prod": 1e10/2.1
+  },
+  "country": {
+    "name": "Country",
+    "plural": "Countries",
+    "cost": 1e13,
+    "prod": 1e11/2.2
+  },
+  "continent": {
+    "name": "Continent",
+    "plural": "Continents",
+    "cost": 1e14,
+    "prod": 1e12/2.3
+  },
+  "planet": {
+    "name": "Planet",
+    "plural": "Planets",
     "cost": 1e15,
-    "prod": 1e14
+    "prod": 1e13/2.4
   }
 }
 

gorge.css

@@ -10,14 +10,22 @@ body.dark {
 #tasty-micro {
   color: #ddd;
   background-color: #211;
-  width: 100px;
-  height: 75px;
+  width: 300px;
+  height: 200px;
+  position: fixed;
+  left: 15%;
+  top: 50%;
+  bottom: 50%;
+  margin: auto;
+  font-size: 60px;
 }
 
 #buildings-area {
   position: absolute;
   width: 20%;
   right: 5%;
+  height: 100%;
+  overflow-y: scroll;
 }
 
 .building-button {

gorge.js

@@ -66,7 +66,7 @@ function displayResources() {
 
 function displayBuildings() {
   for (const [key, value] of Object.entries(belongings)) {
-    document.querySelector("#building-" + key + " > .building-button-name").innerText = value.count + " " + buildings[key].name + (value.count == 1 ? "" : "s");
+    document.querySelector("#building-" + key + " > .building-button-name").innerText = value.count + " " + (value.count == 1 ? buildings[key].name : buildings[key].plural);
     document.querySelector("#building-" + key + " > .building-button-cost").innerText = costOf(key) + " food";
   }
 }