Implement new UI component for icons #230

- Introduce `AppIcon.vue`, offering improved performance over the
  previous `fort-awesome` dependency. This implementation reduces bundle
  size by 67.31KB (tested for web using `npm run build -- --mode prod`).
- Migrate Font Awesome 5 icons to Font Awesome 6.

This commit facilitates migration to Vue 3.0 (#230) and ensures no Vue
component remains tightly bound to a specific Vue version, enhancing
code portability.

Font Awesome license is not included because Font Awesome revokes its
right:

> "Attribution is no longer required as of Font Awesome 3.0"
>
> Sources:
>
> - https://fontawesome.com/v4/license/ (archived: https://web.archive.org/web/20231003213441/https://fontawesome.com/v4/license/, https://archive.ph/Yy9j5)
> - https://github.com/FortAwesome/Font-Awesome/wiki (archived: https://web.archive.org/web/20231003214646/https://github.com/FortAwesome/Font-Awesome/wiki, https://archive.ph/C6sXv)

This commit removes following third-party production dependencies:

- `@fortawesome/vue-fontawesome`
- `@fortawesome/free-solid-svg-icons`
- `@fortawesome/free-regular-svg-icons`
- `@fortawesome/free-brands-svg-icons`
- `@fortawesome/fontawesome-svg-core`

src/presentation/components/TheFooter/DownloadUrlList.vue

@@ -6,7 +6,7 @@
       'container-supported': hasCurrentOsDesktopVersion,
     }">
     <span class="description">
-      <font-awesome-icon class="description__icon" :icon="['fas', 'desktop']" />
+      <AppIcon class="description__icon" icon="desktop" />
       <span class="description__text">For desktop:</span>
     </span>
     <span class="urls">
@@ -21,6 +21,7 @@
 import { defineComponent, inject } from 'vue';
 import { OperatingSystem } from '@/domain/OperatingSystem';
 import { InjectionKeys } from '@/presentation/injectionSymbols';
+import AppIcon from '@/presentation/components/Shared/Icon/AppIcon.vue';
 import DownloadUrlListItem from './DownloadUrlListItem.vue';
 
 const supportedOperativeSystems: readonly OperatingSystem[] = [
@@ -32,6 +33,7 @@ const supportedOperativeSystems: readonly OperatingSystem[] = [
 export default defineComponent({
   components: {
     DownloadUrlListItem,
+    AppIcon,
   },
   setup() {
     const { os: currentOs } = inject(InjectionKeys.useRuntimeEnvironment);

src/presentation/components/TheFooter/TheFooter.vue

@@ -3,7 +3,7 @@
     <div class="footer">
       <div class="footer__section">
         <span v-if="isDesktop" class="footer__section__item">
-          <font-awesome-icon class="icon" :icon="['fas', 'globe']" />
+          <AppIcon class="icon" icon="globe" />
           <span>
             Online version at <a :href="homepageUrl" target="_blank" rel="noopener noreferrer">{{ homepageUrl }}</a>
           </span>
@@ -15,24 +15,24 @@
       <div class="footer__section">
         <div class="footer__section__item">
           <a :href="feedbackUrl" target="_blank" rel="noopener noreferrer">
-            <font-awesome-icon class="icon" :icon="['far', 'smile']" />
+            <AppIcon class="icon" icon="face-smile" />
             <span>Feedback</span>
           </a>
         </div>
         <div class="footer__section__item">
           <a :href="repositoryUrl" target="_blank" rel="noopener noreferrer">
-            <font-awesome-icon class="icon" :icon="['fab', 'github']" />
+            <AppIcon class="icon" icon="github" />
             <span>Source Code</span>
           </a>
         </div>
         <div class="footer__section__item">
           <a :href="releaseUrl" target="_blank" rel="noopener noreferrer">
-            <font-awesome-icon class="icon" :icon="['fas', 'tag']" />
+            <AppIcon class="icon" icon="tag" />
             <span>v{{ version }}</span>
           </a>
         </div>
         <div class="footer__section__item">
-          <font-awesome-icon class="icon" :icon="['fas', 'user-secret']" />
+          <AppIcon class="icon" icon="user-secret" />
           <a @click="showPrivacyDialog()">Privacy</a>
         </div>
       </div>
@@ -48,6 +48,7 @@ import {
   defineComponent, ref, computed, inject,
 } from 'vue';
 import ModalDialog from '@/presentation/components/Shared/Modal/ModalDialog.vue';
+import AppIcon from '@/presentation/components/Shared/Icon/AppIcon.vue';
 import { InjectionKeys } from '@/presentation/injectionSymbols';
 import DownloadUrlList from './DownloadUrlList.vue';
 import PrivacyPolicy from './PrivacyPolicy.vue';
@@ -57,6 +58,7 @@ export default defineComponent({
     ModalDialog,
     PrivacyPolicy,
     DownloadUrlList,
+    AppIcon,
   },
   setup() {
     const { info } = inject(InjectionKeys.useApplication);