From 7aa0368a1367226bb973d8930972b84c72bc3164 Mon Sep 17 00:00:00 2001
From: LenAnderson <Anderson.Len@outlook.com>
Date: Fri, 5 Jan 2024 16:54:26 +0000
Subject: [PATCH] improve modal editor for small screens

---
 public/scripts/extensions/quick-reply/style.css  | 11 +++++++++++
 public/scripts/extensions/quick-reply/style.less | 11 +++++++++++
 2 files changed, 22 insertions(+)

diff --git a/public/scripts/extensions/quick-reply/style.css b/public/scripts/extensions/quick-reply/style.css
index ad3be97c0..e39f0fc7d 100644
--- a/public/scripts/extensions/quick-reply/style.css
+++ b/public/scripts/extensions/quick-reply/style.css
@@ -209,6 +209,17 @@
   gap: 0.5em;
   align-items: baseline;
 }
+@media screen and (max-width: 750px) {
+  body #dialogue_popup:has(#qr--modalEditor) #dialogue_popup_text > #qr--modalEditor {
+    flex-direction: column;
+  }
+  body #dialogue_popup:has(#qr--modalEditor) #dialogue_popup_text > #qr--modalEditor > #qr--main > .qr--labels {
+    flex-direction: column;
+  }
+  body #dialogue_popup:has(#qr--modalEditor) #dialogue_popup_text > #qr--modalEditor > #qr--main > .qr--modal-messageContainer > #qr--modal-message {
+    min-height: 90svh;
+  }
+}
 #dialogue_popup:has(#qr--modalEditor) {
   aspect-ratio: unset;
 }
diff --git a/public/scripts/extensions/quick-reply/style.less b/public/scripts/extensions/quick-reply/style.less
index 0d9745e0b..1f440ea67 100644
--- a/public/scripts/extensions/quick-reply/style.less
+++ b/public/scripts/extensions/quick-reply/style.less
@@ -235,6 +235,17 @@
 
 
 
+@media screen and (max-width: 750px) {
+	body #dialogue_popup:has(#qr--modalEditor) #dialogue_popup_text > #qr--modalEditor {
+		flex-direction: column;
+		> #qr--main > .qr--labels {
+			flex-direction: column;
+		}
+		> #qr--main > .qr--modal-messageContainer > #qr--modal-message {
+			min-height: 90svh;
+		}
+	}
+}
 #dialogue_popup:has(#qr--modalEditor) {
 	aspect-ratio: unset;