Update style to handle tablets

views/dashboardPage/controller.js

@@ -109,4 +109,8 @@ let closeMenu = ()=>{
     document.getElementById("mobileMenuSelector").onclick = ()=>{openMenu()};
 }
 
+if(window.screen.availWidth > 1000 && window.screen.availWidth <= 1400){
+    changeMenu();
+    document.getElementById("menuShifter2").style.display = "none";
+}
 homeStrandObj.display();

views/dashboardPage/dashboard.ejs

@@ -26,7 +26,7 @@
                     <img class="menuLogoMin" src="/shared/images/logo.png" alt="The Subline">
                 </a>
         
-                <button onclick="changeMenu()">&#8801;</button>
+                <button id="menuShifter2" onclick="changeMenu()">&#8801;</button>
             </div>
         
             <button id="homeBtn" class="active" onclick="changeStrand('homeStrand')">

views/dashboardPage/sidebars/sidebars.css

@@ -627,6 +627,12 @@ New Transaction
         overflow-y: auto;
     }
 
+@media screen and (max-width: 1400px){
+    .sidebar{
+        width: 30vw;
+    }
+}
+
 @media screen and (max-width: 1000px){
     .sidebar{
         width: 100vw;