From 5f042a2c8d9be179a3bf547beac9ac266c011eb4 Mon Sep 17 00:00:00 2001
From: Kris <kris.aubuchon@discourse.org>
Date: Thu, 20 Sep 2018 16:12:08 -0400
Subject: [PATCH] Prevent move to new topic tag input from becoming too wide on
 click

---
 .../javascripts/select-kit/components/multi-select.js.es6      | 2 +-
 app/assets/stylesheets/common/select-kit/multi-select.scss     | 1 +
 app/assets/stylesheets/desktop/modal.scss                      | 3 ++-
 3 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/select-kit/components/multi-select.js.es6 b/app/assets/javascripts/select-kit/components/multi-select.js.es6
index 79dc0c0f148..c27c82a51f8 100644
--- a/app/assets/javascripts/select-kit/components/multi-select.js.es6
+++ b/app/assets/javascripts/select-kit/components/multi-select.js.es6
@@ -39,7 +39,7 @@ export default SelectKitComponent.extend({
   @on("didRender")
   _setChoicesMaxWidth() {
     const width = this.$body().outerWidth(false);
-    this.$(".choices").css({ maxWidth: width, width });
+    this.$(".choices").css({ maxWidth: width });
   },
 
   @on("didReceiveAttrs")
diff --git a/app/assets/stylesheets/common/select-kit/multi-select.scss b/app/assets/stylesheets/common/select-kit/multi-select.scss
index f428b0bff90..10f0aeb5807 100644
--- a/app/assets/stylesheets/common/select-kit/multi-select.scss
+++ b/app/assets/stylesheets/common/select-kit/multi-select.scss
@@ -70,6 +70,7 @@
       display: flex;
       justify-content: flex-start;
       flex-wrap: wrap;
+      width: 100%;
 
       .choice {
         display: inline-flex;
diff --git a/app/assets/stylesheets/desktop/modal.scss b/app/assets/stylesheets/desktop/modal.scss
index 88ede5345c7..4fe10c2b897 100644
--- a/app/assets/stylesheets/desktop/modal.scss
+++ b/app/assets/stylesheets/desktop/modal.scss
@@ -139,10 +139,11 @@
     }
 
     form {
+      width: 95%;
       margin-top: 20px;
       #split-topic-name,
       #choose-topic-title {
-        width: 520px;
+        width: 100%;
       }
     }
   }