Fix responsive layout issues

aelassas · Dec 14, 2024 · fb931ea · fb931ea
1 parent 62dc9cc
commit fb931ea
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/frontend/src/assets/css/common.css b/frontend/src/assets/css/common.css
@@ -224,7 +224,22 @@ div.content {
   background-color: #FAFAFA;
 }
 
+@media only screen and (width <=550px) {
+  .search-dialog-content {
+    width: calc(100%- 20px);
+    max-width: 480px;
+  }
+}
+
+@media only screen and (width <=960px) and (width >550px) {
+  .search-dialog-content {
+    width: 480px;
+    overflow-x: hidden;
+  }
+}
+
 @media only screen and (width <=960px) {
+
   .buttons {
     margin-top: 15px;
     margin-bottom: 5px;

diff --git a/frontend/src/assets/css/home.css b/frontend/src/assets/css/home.css
@@ -410,6 +410,8 @@ div.home div.customer-care div.customer-care-img img {
   div.home div.search div.home-search {
     padding: 20px 10px;
     margin: -187px 20px 0 20px;
+    width: calc(100% - 20px);
+    max-width: 480px;
   }
 
   div.home div.why div.why-boxes,