From fb931eae19b1e7e0ee0e42e1e6442966b532cecd Mon Sep 17 00:00:00 2001
From: aelassas <akram.elassas@gmail.com>
Date: Sat, 14 Dec 2024 19:29:19 +0100
Subject: [PATCH] Fix responsive layout issues

---
 frontend/src/assets/css/common.css | 15 +++++++++++++++
 frontend/src/assets/css/home.css   |  2 ++
 2 files changed, 17 insertions(+)

diff --git a/frontend/src/assets/css/common.css b/frontend/src/assets/css/common.css
index c34d3507f..f7e0074e8 100644
--- 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
index c34c09481..a3f5b3afb 100644
--- 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,