made exerciseBank more mobile responsive

README.md

@@ -26,6 +26,7 @@ As this is a currently developing project, there's a quite a lot of things I wou
  2. Expand the exercise bank with more workouts. 
  3. Create a separate exercise bank that's purely community-driven. They'll be able to add and "like" the best exercises, so the ones with the best descriptions and videos will naturally rise to the top.
  4. Make a way for any particular exercise to be presented to the user as a graph based on past reps, sets, and weight increases so that they can see all the progress they've been making.
+ 5. Fix HTTPS bug regarding google fonts
 
 ---
 <h2>Lessons Learned</h2>

public/assets/css/fitnessApp.css

@@ -266,6 +266,37 @@ footer a {
     .notes textarea {
         width: 90%;
     }
+
+    #exerciseBank {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        /* flex-wrap: wrap; */
+        width: 100%;
+    }
+
+    #exerciseBank > * {
+        width: 100%;
+        padding: 0;
+        /* margin: 0 auto; */
+    }
+
+    #exerciseBank .bankLeft{
+        padding: 0;
+    }
+
+    .bankLeft ul {
+        margin: 0 auto;
+        padding: 1em 0 0 0;
+        height: 5em;
+        overflow: scroll;
+    }
+
+    #exerciseBank .bankInfo {
+        padding-bottom: 2em;
+    }
+
+
 }
 
 @media screen and (max-width: 600px) {

views/fitnessApp.ejs

@@ -86,7 +86,7 @@
 									<li><a href="/">Log Out</a></li>
 								</ul>
 								<section id="exerciseBank" class="hidden">
-									<section class="">
+									<section class="bankLeft">
 										<ul id="bankList">
 											<!-- Appending list via JS -->
 										</ul>