Add map size toggle button to trip page

Closes: #178

templates/trip_page.html

@@ -52,8 +52,24 @@
   /* Additional styling for grid items can go here */
 }
 
-#map {
-  height: 90vh;
+.half-map {
+  height: 100vh;
+}
+
+.full-window-map {
+  position: fixed; /* Make the map fixed position */
+  top: 56px;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 9999; /* Make sure it sits on top */
+}
+
+#toggleMapSize {
+  position: fixed;  /* Fixed position */
+  top: 66px;        /* 10px from the top */
+  right: 10px;      /* 10px from the right */
+  z-index: 10000;   /* Higher than the map's z-index */
 }
 
 </style>
@@ -296,7 +312,9 @@
     </div>
   </div>
   <div class="col-md-6 col-sm-12">
-    <div id="map"></div>
+    <button id="toggleMapSize" class="btn btn-primary mb-2">Toggle map size</button>
+    <div id="map" class="half-map">
+    </div>
   </div>
 </div>
 {% endblock %}