From f624b81cb723183a96f9810860e8d660be5276bb Mon Sep 17 00:00:00 2001
From: Hridyanshu7 <himank7794@gmail.com>
Date: Sun, 17 Mar 2024 12:28:49 +0530
Subject: [PATCH 1/2] Solved - Issue #741 Upload model form on view page needs
 adjustment on mobile view

More Details. Added media queries to handle this in components\modalbox\modalbox.css
---
 components/modalbox/modalbox.css | 18 +++++++++++++++++-
 1 file changed, 17 insertions(+), 1 deletion(-)

diff --git a/components/modalbox/modalbox.css b/components/modalbox/modalbox.css
index 1d9e0acbe..a76a2114e 100644
--- a/components/modalbox/modalbox.css
+++ b/components/modalbox/modalbox.css
@@ -22,11 +22,27 @@
   padding: 0;
   border: 1px solid #888;
   width: 80%;
+  
+  @media only screen and (max-width: 1100px) {
+        width: 50%;
+  }
+
+  @media only screen and (max-width: 600px) {
+        width: 85%;
+  }
+
   box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
   -webkit-animation-name: animatetop;
   -webkit-animation-duration: 0.4s;
   animation-name: animatetop;
-  animation-duration: 0.4s
+  animation-duration: 0.4s;
+}
+
+.modalbox-content #modelupload, 
+.modalbox-content #weightsupload {
+  @media only screen and (max-width: 600px) {
+        width: 90%;
+  }
 }
 
 /* Add Animation */

From 37726e7e4e23aadf1d34de8e3997a9df0c4ace6d Mon Sep 17 00:00:00 2001
From: Hridyanshu7 <himank7794@gmail.com>
Date: Wed, 27 Mar 2024 01:06:51 +0530
Subject: [PATCH 2/2] Specificity issue solved:

added responsive styles in #upload_panel .modalbox-content{} instead of .modalbox-content{}
---
 apps/model/model.css             | 8 ++++++++
 components/modalbox/modalbox.css | 8 --------
 2 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/apps/model/model.css b/apps/model/model.css
index 9322502c3..32ef379a7 100644
--- a/apps/model/model.css
+++ b/apps/model/model.css
@@ -276,6 +276,14 @@ ul.disabled {
 }
 #upload_panel .modalbox-content{
     width: 30%;
+
+    @media only screen and ( max-width: 1100px ) {
+        width: 50%;
+    }
+
+    @media only screen and ( max-width: 600px ) {
+        width: 85%;
+    }
 }
 
 #roi_panel .modalbox-content{
diff --git a/components/modalbox/modalbox.css b/components/modalbox/modalbox.css
index a76a2114e..50b39a4a2 100644
--- a/components/modalbox/modalbox.css
+++ b/components/modalbox/modalbox.css
@@ -22,14 +22,6 @@
   padding: 0;
   border: 1px solid #888;
   width: 80%;
-  
-  @media only screen and (max-width: 1100px) {
-        width: 50%;
-  }
-
-  @media only screen and (max-width: 600px) {
-        width: 85%;
-  }
 
   box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
   -webkit-animation-name: animatetop;