Update analytics strand responsiveness for portrait mode.

views/dashboardPage/dashboard.css

@@ -677,6 +677,57 @@ Modal
             width: 90%;
         }
 
+        /* ANALYTICS */
+        #analyticsStrand .strandHead{
+            height: 23vh;
+            flex-direction: column;
+        }
+
+            #analyticsStrand .strandTitle{
+                position: static;
+            }
+
+            .switch{
+                margin-top: 0;
+            }
+
+            .analDateRange{
+                display: none;
+            }
+
+        .analContent{
+            flex-direction: column;
+            justify-content: space-between;
+            padding: 0;
+            height: 70vh;
+        }
+
+            .itemsList{
+                width: 90%;
+                height: 47%;
+                margin-bottom: 10px;
+            }
+
+            .analData{
+                height: 47%;
+            }
+
+                .dataRow{
+                    flex-direction: column;
+                }
+
+            #itemUseGraph{
+                display: none;
+            }
+
+            #analDailyAverages{
+                display: none;
+            }
+
+            #recipeSalesGraph{
+                display: none;
+            }
+
         @media screen and (min-width: 601px){
             .strandTitle{
                 font-size: 40px;

views/dashboardPage/dashboard.ejs

@@ -263,7 +263,7 @@
                     </label>
 
                     <div class="dateRange">
-                        <h3 class="mobileHide">Date Range:</h3>
+                        <h3 class="analDateRange">Date Range:</h3>
                         <div class="dateRangeInput">
                             <input id="analStartDate" type="date">
                             <p> - </p>
@@ -278,7 +278,7 @@
                     <div id="analIngredientList" class="itemsList"></div>
 
                     <div class="analData">
-                        <div id="itemUseGraph" class="card analCard mobileHide"></div>
+                        <div id="itemUseGraph" class="card analCard"></div>
 
                         <div class="dataRow">
                             <div class="card analCard">
@@ -300,7 +300,7 @@
                             </div>
                         </div>
 
-                        <div class="mobileHide dataRow">
+                        <div id="analDailyAverages" class="dataRow">
                             <div class="card analCard">
                                 <p>Sunday Average</p>
 
@@ -350,7 +350,7 @@
                     <ul id="analRecipeList" class="itemsList"></ul>
 
                     <div class="analData">
-                        <div id="recipeSalesGraph" class="card analCard mobileHide"></div>
+                        <div id="recipeSalesGraph" class="card analCard"></div>
 
                         <div class="dataRow">
                             <div class="card analCard">