From 3df6cb1ec92a22c80ed2fa8709b8a5dfdf02ef1b Mon Sep 17 00:00:00 2001
From: Ty Correll <tytekkit@gmail.com>
Date: Sat, 4 Nov 2023 12:52:51 -0500
Subject: [PATCH] UX: prevent suggestion button from wrapping (#282)

* UX: prevent suggestion button from wrapping

This PR addresses the visual bug where the suggestion button wraps on any screen size.

* UX: edge case screen size

This addition fixes screen size issues at specific screen sizes without affecting larger screen sizes, no media query necessary.
---
 .../modules/ai-helper/common/ai-helper.scss    | 18 +++++++-----------
 1 file changed, 7 insertions(+), 11 deletions(-)

diff --git a/assets/stylesheets/modules/ai-helper/common/ai-helper.scss b/assets/stylesheets/modules/ai-helper/common/ai-helper.scss
index f29be273..77de358c 100644
--- a/assets/stylesheets/modules/ai-helper/common/ai-helper.scss
+++ b/assets/stylesheets/modules/ai-helper/common/ai-helper.scss
@@ -292,17 +292,13 @@
   position: relative;
 }
 
-// Prevent suggestion button from wrapping on smaller screens
-@media screen and (max-width: 768px) {
-  #reply-control .composer-fields.showing-ai-suggestions {
-    .category-input {
-      .category-chooser {
-        width: 10px;
-      }
-
-      + .mini-tag-chooser {
-        width: 10px;
-      }
+// Prevent suggestion button from wrapping
+#reply-control {
+  .with-category .showing-ai-suggestions .category-input,
+  .with-tags .showing-ai-suggestions .mini-tag-chooser {
+    flex-wrap: nowrap;
+    .select-kit {
+      max-width: calc(100% - 34px);
     }
   }
 }