fix(app): responsiveness issues

src/components/Orders/Order.vue

@@ -53,7 +53,7 @@ $darkModeTextCol: #eee;
   align-items: start;
   max-width: 800px;
 
-  @media screen and (max-width: 650px) {
+  @media screen and (max-width: 1150px) {
     flex-direction: column;
   }
 }
@@ -62,7 +62,7 @@ $darkModeTextCol: #eee;
   background-color: white;
   color: black;
 
-  height: calc(100vh - 5em);
+  max-height: calc(100vh - 5em);
   overflow: auto;
 
   &.dark {

src/components/Orders/OrderSideBar.vue

@@ -126,7 +126,7 @@ button.option-save {
   }
 }
 
-@media screen and (max-width: 650px) {
+@media screen and (max-width: 1150px) {
   .sidebar_content {
     flex-direction: row;
 

src/views/Home.vue

@@ -101,7 +101,7 @@ const panelComponent = computed(() => {
   padding: 1em;
   width: 100%;
 
-  @media screen and (max-width: 1350px) {
+  @media screen and (max-width: 1150px) {
     grid-template-columns: auto;
     padding: 1em 0.5em;
   }