fix conflict, keep the touchable button big

2 files changed, 19 insertions, 6 deletions

diff --git a/src/components/importer/importer.js b/src/components/importer/importer.js
index c5f9e4d2..59f9beb1 100644
--- a/src/components/importer/importer.js
+++ b/src/components/importer/importer.js
@@ -1,3 +1,14 @@
+import { library } from '@fortawesome/fontawesome-svg-core'
+import {
+  faCircleNotch,
+  faTimes
+} from '@fortawesome/free-solid-svg-icons'
+
+library.add(
+  faCircleNotch,
+  faTimes
+)
+
 const Importer = {
   props: {
     submitHandler: {
diff --git a/src/components/importer/importer.vue b/src/components/importer/importer.vue
index ed923d59..c4fe5b00 100644
--- a/src/components/importer/importer.vue
+++ b/src/components/importer/importer.vue
@@ -7,9 +7,11 @@
         @change="change"
       >
     </form>
-    <i
+    <FAIcon
       v-if="submitting"
-      class="icon-spin4 animate-spin importer-uploading"
+      class="importer-uploading"
+      spin
+      icon="circle-notch"
     />
     <button
       v-else
@@ -19,15 +21,15 @@
       {{ submitButtonLabel }}
     </button>
     <div v-if="success">
-      <i
-        class="icon-cross"
+      <FAIcon
+        icon="times"
         @click="dismiss"
       />
       <p>{{ successMessage }}</p>
     </div>
     <div v-else-if="error">
-      <i
-        class="icon-cross"
+      <FAIcon
+        icon="times"
         @click="dismiss"
       />
       <p>{{ errorMessage }}</p>