From 997eacc64aef886ac367d23948c085c43b7642db Mon Sep 17 00:00:00 2001
From: tophf <tophf@gmx.com>
Date: Tue, 3 Jul 2018 09:16:46 +0300
Subject: [PATCH] add a wrapper for the applies-to value and its action buttons

---
 edit.html     | 14 ++++++++------
 edit/edit.css |  4 ++++
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/edit.html b/edit.html
index 3f50d87f..eeba54a2 100644
--- a/edit.html
+++ b/edit.html
@@ -100,12 +100,14 @@
           </select>
           <svg class="svg-icon select-arrow"><use xlink:href="#svg-icon-select-arrow"/></svg>
         </div>
-        <input name="applies-value" class="applies-value style-contributor" spellcheck="false">
-        <div class="remove-applies-to" i18n-text="appliesRemove" i18n-title="appliesRemove">
-          <svg class="svg-icon remove"><use xlink:href="#svg-icon-minus"/></svg>
-        </div>
-        <div class="add-applies-to" i18n-text="appliesAdd" i18n-title="appliesAdd">
-          <svg class="svg-icon add"><use xlink:href="#svg-icon-plus"/></svg>
+        <div class="applies-value-wrapper">
+          <input name="applies-value" class="applies-value style-contributor" spellcheck="false">
+          <div class="remove-applies-to" i18n-text="appliesRemove" i18n-title="appliesRemove">
+            <svg class="svg-icon remove"><use xlink:href="#svg-icon-minus"/></svg>
+          </div>
+          <div class="add-applies-to" i18n-text="appliesAdd" i18n-title="appliesAdd">
+            <svg class="svg-icon add"><use xlink:href="#svg-icon-plus"/></svg>
+          </div>
         </div>
       </li>
     </template>
diff --git a/edit/edit.css b/edit/edit.css
index 1be3945e..1c924bab 100644
--- a/edit/edit.css
+++ b/edit/edit.css
@@ -415,6 +415,10 @@ html:not(.usercss) .applies-to li:last-child .add-applies-to {
 .applies-to li .add-applies-to:first-child {
   margin-left: 1rem;
 }
+.applies-to li .applies-value-wrapper {
+  flex-grow: 1;
+  display: flex;
+}
 .applies-to li .applies-value {
   flex-grow: 1;
   padding-left: 0.2rem;