FIX: Mobile layout for watched words admin UI (#13427)

FIX: Mobile layout for watched words admin UI (#13427)

diff --git a/app/assets/javascripts/admin/addon/controllers/admin-watched-words.js b/app/assets/javascripts/admin/addon/controllers/admin-watched-words.js
index ce41e74..1830e4c 100644
--- a/app/assets/javascripts/admin/addon/controllers/admin-watched-words.js
+++ b/app/assets/javascripts/admin/addon/controllers/admin-watched-words.js
@@ -35,7 +35,6 @@ export default Controller.extend({
         })
       );
     });
-
     this.set("model", model);
   },
 
diff --git a/app/assets/javascripts/admin/addon/templates/watched-words.hbs b/app/assets/javascripts/admin/addon/templates/watched-words.hbs
index 3342a22..e353cb2 100644
--- a/app/assets/javascripts/admin/addon/templates/watched-words.hbs
+++ b/app/assets/javascripts/admin/addon/templates/watched-words.hbs
@@ -1,26 +1,28 @@
-<div class="admin-controls">
-  <div class="controls">
-    {{d-button action=(action "toggleMenu") class="menu-toggle" icon="bars"}}
-    {{text-field value=filter placeholderKey="admin.watched_words.search" class="no-blur"}}
-    {{d-button action=(action "clearFilter") label="admin.watched_words.clear_filter"}}
+<div class="admin-contents">
+  <div class="admin-controls">
+    <div class="controls">
+      {{d-button action=(action "toggleMenu") class="menu-toggle" icon="bars"}}
+      {{text-field value=filter placeholderKey="admin.watched_words.search" class="no-blur"}}
+      {{d-button action=(action "clearFilter") label="admin.watched_words.clear_filter"}}
+    </div>
   </div>
-</div>
 
-<div class="admin-nav pull-left">
-  <ul class="nav nav-stacked">
-    {{#each model as |action|}}
-      <li class={{action.nameKey}}>
-        {{#link-to "adminWatchedWords.action" action.nameKey}}
-          {{action.name}}
-          {{#if action.words}}<span class="count">({{action.words.length}})</span>{{/if}}
-        {{/link-to}}
-      </li>
-    {{/each}}
-  </ul>
-</div>
+  <div class="admin-nav pull-left">
+    <ul class="nav nav-stacked">
+      {{#each model as |action|}}
+        <li class={{action.nameKey}}>
+          {{#link-to "adminWatchedWords.action" action.nameKey}}
+            {{action.name}}
+            {{#if action.words}}<span class="count">({{action.words.length}})</span>{{/if}}
+          {{/link-to}}
+        </li>
+      {{/each}}
+    </ul>
+  </div>
 
-<div class="admin-detail pull-left mobile-closed watched-words-detail">
-  {{outlet}}
-</div>
+  <div class="admin-detail pull-left mobile-closed watched-words-detail">
+    {{outlet}}
+  </div>
 
-<div class="clearfix"></div>
+  <div class="clearfix"></div>
+</div>
diff --git a/app/assets/stylesheets/common/admin/staff_logs.scss b/app/assets/stylesheets/common/admin/staff_logs.scss
index 639820c..c893a17 100644
--- a/app/assets/stylesheets/common/admin/staff_logs.scss
+++ b/app/assets/stylesheets/common/admin/staff_logs.scss
@@ -396,6 +396,11 @@ table.screened-ip-addresses {
   .watched-word-form {
     margin-bottom: 1em;
   }
+
+  .watched-word-controls .btn {
+    margin-bottom: 0.25em;
+    margin-right: 0.25em;
+  }
 }
 
 .watched-words-test-modal p {

GitHub sha: e9e28276369bd1262449645f0e95e7d0db635200

This commit appears in #13427 which was approved by eviltrout. It was merged by pmusaraj.