Merge branch 'feat/moderation-tools-chevron' into 'develop'

Add a chevron to moderation tools button to indicate it opens a menu

Closes #1069

See merge request pleroma/pleroma-fe!1377

2 files changed, 13 insertions, 1 deletions

diff --git a/src/components/moderation_tools/moderation_tools.js b/src/components/moderation_tools/moderation_tools.js
index d4fdc53e..2469327a 100644
--- a/src/components/moderation_tools/moderation_tools.js
+++ b/src/components/moderation_tools/moderation_tools.js
@@ -1,6 +1,11 @@
+import { library } from '@fortawesome/fontawesome-svg-core'
+import { faChevronDown } from '@fortawesome/free-solid-svg-icons'
+
 import DialogModal from '../dialog_modal/dialog_modal.vue'
 import Popover from '../popover/popover.vue'
 
+library.add(faChevronDown)
+
 const FORCE_NSFW = 'mrf_tag:media-force-nsfw'
 const STRIP_MEDIA = 'mrf_tag:media-strip'
 const FORCE_UNLISTED = 'mrf_tag:force-unlisted'
diff --git a/src/components/moderation_tools/moderation_tools.vue b/src/components/moderation_tools/moderation_tools.vue
index bf25adc5..c4c6ee46 100644
--- a/src/components/moderation_tools/moderation_tools.vue
+++ b/src/components/moderation_tools/moderation_tools.vue
@@ -124,10 +124,11 @@
       </div>
       <button
         slot="trigger"
-        class="btn button-default btn-block"
+        class="btn button-default btn-block moderation-tools-button"
         :class="{ toggled }"
       >
         {{ $t('user_card.admin_menu.moderation') }}
+        <FAIcon icon="chevron-down" />
       </button>
     </Popover>
     <portal to="modal">
@@ -170,4 +171,10 @@
     height: 100%;
   }
 }
+
+.moderation-tools-button {
+  svg,i {
+    font-size: 0.8em;
+  }
+}
 </style>