From 8e594f2691004b2878eb5b13ac88869e267c9649 Mon Sep 17 00:00:00 2001
From: mohit-bhandari45 <mohitbhandari852@gmail.com>
Date: Sun, 12 May 2024 17:30:59 +0530
Subject: [PATCH 1/3] fixed the mobile view

---
 frontend/src/App.css | 58 +++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 57 insertions(+), 1 deletion(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index d7786b5..ffdff1d 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -435,7 +435,63 @@ background-color: #5773ff;
 }
 
 
-@media(max-width: 768px) {
+@media(max-width: 1700px) {
+  .player {
+    width: 50vh;
+    height: 80vh; 
+    padding: 20px 14px 8px 14px;
+    border: none;
+    border-top-left-radius: 15px;
+    border-bottom-left-radius: 15px;
+    display: flex;
+    flex-direction: column;
+    background-color: #f1f4f5;
+    justify-content: space-evenly;
+  }
+
+  .search-box {
+    width: 35vh;
+    height: 80vh;
+    max-height: 90vh; 
+    padding: 20px 14px 8px 14px;
+    border: none;
+    border-top-right-radius: 15px;
+    border-bottom-right-radius: 15px;
+    background-color:#e8ecef;
+    display: flex;
+    flex-direction: column;
+  }
+}
+
+@media(max-width: 1200px) {
+  .player {
+    width: 40vh;
+    height: 60vh; 
+    padding: 20px 14px 8px 14px;
+    border: none;
+    border-top-left-radius: 15px;
+    border-bottom-left-radius: 15px;
+    display: flex;
+    flex-direction: column;
+    background-color: #f1f4f5;
+    justify-content: space-evenly;
+  }
+
+  .search-box {
+    width: 30vh;
+    height: 60vh;
+    max-height: 90vh; 
+    padding: 20px 14px 8px 14px;
+    border: none;
+    border-top-right-radius: 15px;
+    border-bottom-right-radius: 15px;
+    background-color:#e8ecef;
+    display: flex;
+    flex-direction: column;
+  }
+}
+
+@media(max-width: 980px) {
   .ui {
     display: flex;
     flex-direction: column;

From 29a4578954c0157b047a6671376fab4b46f65dcb Mon Sep 17 00:00:00 2001
From: mohit-bhandari45 <mohitbhandari852@gmail.com>
Date: Mon, 13 May 2024 17:53:25 +0530
Subject: [PATCH 2/3] added responsiveness

---
 frontend/src/App.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index ffdff1d..750d4c2 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -435,7 +435,7 @@ background-color: #5773ff;
 }
 
 
-@media(max-width: 1700px) {
+@media(max-width: 1450px) {
   .player {
     width: 50vh;
     height: 80vh; 

From 6325ab3327a9143f29757b8ca32401268d11f3ad Mon Sep 17 00:00:00 2001
From: mohit-bhandari45 <mohitbhandari852@gmail.com>
Date: Mon, 13 May 2024 18:26:32 +0530
Subject: [PATCH 3/3] responsive

---
 frontend/src/App.css | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index 3a0e61a..5459e23 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -25,6 +25,7 @@ body {
   flex-direction: column;
   background-color: #f1f4f5;
   justify-content: space-evenly;
+  
 }
 
 .search-box {
@@ -46,11 +47,14 @@ body {
 .imgBx{
   display: flex;
   justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 80%;
 }
 
 .imgBx img {
-  width:360px;
-  height: 360px;
+  width:100%;
+  height: 100%;
   border: none;
   border-radius: 10px;
   align-items: center;