Merge branch 'fontawesome5' into 'develop'

FontAwesome 5

Closes #982

See merge request pleroma/pleroma-fe!1260

src/components/poll/poll_form.vue

@@ -25,8 +25,9 @@
         v-if="options.length > 2"
         class="icon-container"
       >
-        <i
-          class="icon-cancel"
+        <FAIcon
+          icon="times"
+          class="delete"
           @click="deleteOption(index)"
         />
       </div>
@@ -36,7 +37,11 @@
       class="add-option faint"
       @click="addOption"
     >
-      <i class="icon-plus" />
+      <FAIcon
+        icon="plus"
+        size="sm"
+      />
+
       {{ $t("polls.add_option") }}
     </a>
     <div class="poll-type-expiry">
@@ -56,7 +61,10 @@
             <option value="single">{{ $t('polls.single_choice') }}</option>
             <option value="multiple">{{ $t('polls.multiple_choices') }}</option>
           </select>
-          <i class="icon-down-open" />
+          <FAIcon
+            class="select-down-icon"
+            icon="chevron-down"
+          />
         </label>
       </div>
       <div
@@ -84,7 +92,10 @@
               {{ $t(`time.${unit}_short`, ['']) }}
             </option>
           </select>
-          <i class="icon-down-open" />
+          <FAIcon
+            class="select-down-icon"
+            icon="chevron-down"
+          />
         </label>
       </div>
     </div>
@@ -104,6 +115,7 @@
   .add-option {
     align-self: flex-start;
     padding-top: 0.25em;
+    padding-left: 0.1em;
     cursor: pointer;
   }
 
@@ -125,9 +137,17 @@
 
   .icon-container {
     // Hack: Move the icon over the input box
-    width: 2em;
-    margin-left: -2em;
+    width: 1.5em;
+    margin-left: -1.5em;
     z-index: 1;
+
+    .delete {
+      cursor: pointer;
+
+      &:hover {
+        color: inherit;
+      }
+    }
   }
 
   .poll-type-expiry {