Merge remote-tracking branch 'origin/develop' into settings-changed

* origin/develop: (306 commits)
  fallback if shadows aren't defined
  Translated using Weblate (Chinese (Traditional))
  Translated using Weblate (Ukrainian)
  Translated using Weblate (Italian)
  Translated using Weblate (Ukrainian)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Italian)
  Translated using Weblate (Russian)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Russian)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  Translated using Weblate (Portuguese)
  ...

2 files changed, 30 insertions, 39 deletions

diff --git a/src/components/media_upload/media_upload.js b/src/components/media_upload/media_upload.js
index 7b8a76cc..669d8190 100644
--- a/src/components/media_upload/media_upload.js
+++ b/src/components/media_upload/media_upload.js
@@ -2,6 +2,14 @@
 import statusPosterService from '../../services/status_poster/status_poster.service.js'
 import fileSizeFormatService from '../../services/file_size_format/file_size_format.js'
 
+import { library } from '@fortawesome/fontawesome-svg-core'
+import { faUpload, faCircleNotch } from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faUpload,
+  faCircleNotch
+)
+
 const mediaUpload = {
   data () {
     return {
diff --git a/src/components/media_upload/media_upload.vue b/src/components/media_upload/media_upload.vue
index c8865d77..e955aa72 100644
--- a/src/components/media_upload/media_upload.vue
+++ b/src/components/media_upload/media_upload.vue
@@ -1,30 +1,29 @@
 <template>
-  <div
+  <label
     class="media-upload"
     :class="{ disabled: disabled }"
+    :title="$t('tool_tip.media_upload')"
   >
-    <label
-      class="label"
-      :title="$t('tool_tip.media_upload')"
+    <FAIcon
+      v-if="uploading"
+      class="progress-icon"
+      icon="circle-notch"
+      spin
+    />
+    <FAIcon
+      v-if="!uploading"
+      class="new-icon"
+      icon="upload"
+    />
+    <input
+      v-if="uploadReady"
+      :disabled="disabled"
+      type="file"
+      style="position: fixed; top: -100em"
+      multiple="true"
+      @change="change"
     >
-      <i
-        v-if="uploading"
-        class="progress-icon icon-spin4 animate-spin"
-      />
-      <i
-        v-if="!uploading"
-        class="new-icon icon-upload"
-      />
-      <input
-        v-if="uploadReady"
-        :disabled="disabled"
-        type="file"
-        style="position: fixed; top: -100em"
-        multiple="true"
-        @change="change"
-      >
-    </label>
-  </div>
+  </label>
 </template>
 
 <script src="./media_upload.js" ></script>
@@ -33,22 +32,6 @@
 @import '../../_variables.scss';
 
 .media-upload {
-  .label {
-    display: inline-block;
-  }
-
-  .new-icon {
-    cursor: pointer;
-  }
-
-  .progress-icon {
-    display: inline-block;
-    line-height: 0;
-    &::before {
-      /* Overriding fontello to achieve the perfect speeeen */
-      margin: 0;
-      line-height: 0;
-    }
-  }
+  cursor: pointer;
 }
  </style>