refactor: font awesome 5 icons

Signed-off-by: Corentin Thomasset <corentin.thomasset74@gmail.com>

package-lock.json

@@ -972,6 +972,12 @@
         "to-fast-properties": "^2.0.0"
       }
     },
+    "@fortawesome/fontawesome-free": {
+      "version": "5.13.0",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-free/-/fontawesome-free-5.13.0.tgz",
+      "integrity": "sha512-xKOeQEl5O47GPZYIMToj6uuA2syyFlq9EMSl2ui0uytjY9xbe8XS0pexNWmxrdcCyNGyDmLyYw5FtKsalBUeOg==",
+      "dev": true
+    },
     "@hapi/address": {
       "version": "2.1.4",
       "resolved": "https://registry.npmjs.org/@hapi/address/-/address-2.1.4.tgz",
@@ -5293,11 +5299,6 @@
         }
       }
     },
-    "font-awesome": {
-      "version": "4.7.0",
-      "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz",
-      "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM="
-    },
     "for-in": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz",

package.json

@@ -11,7 +11,6 @@
   "dependencies": {
     "axios": "^0.19.2",
     "core-js": "^3.6.4",
-    "font-awesome": "^4.7.0",
     "register-service-worker": "^1.7.1",
     "roboto-fontface": "*",
     "vue": "^2.6.11",
@@ -21,6 +20,7 @@
     "vuetify-toast-snackbar": "^0.6.1"
   },
   "devDependencies": {
+    "@fortawesome/fontawesome-free": "^5.13.0",
     "@vue/cli-plugin-babel": "~4.3.0",
     "@vue/cli-plugin-eslint": "~4.3.0",
     "@vue/cli-plugin-pwa": "~4.3.0",

src/App.vue

@@ -61,7 +61,7 @@
                 <router-link to="/about">About</router-link>
 
                 <a href="https://github.com/CorentinTh/it-tools" target="_blank" class="navbar-link">
-                    <v-icon>fa-github</v-icon>
+                    <v-icon>fab fa-github</v-icon>
                 </a>
             </div>
         </v-app-bar>

src/main.js

@@ -4,7 +4,7 @@ import './registerServiceWorker'
 import router from './router'
 import vuetify from './plugins/vuetify'
 import 'roboto-fontface/css/roboto/roboto-fontface.css'
-import 'font-awesome/css/font-awesome.css'
+import '@fortawesome/fontawesome-free/css/all.css'
 import './plugins/crypto-js'
 import './plugins/toast-snackbar'
 

src/plugins/vuetify.js

@@ -24,6 +24,6 @@ export default new Vuetify({
     },
   },
   icons: {
-    iconfont: 'fa4',
+    iconfont: 'fa',
   },
 });

src/router.js

@@ -26,7 +26,7 @@ const toolsComponents = [
                 keywords: ['token', 'random', 'string', 'alphanumeric']
             },
             {
-                icon: 'fa-key',
+                icon: 'fa-fingerprint',
                 text: 'Uuid generator',
                 path: '/uuid-generator',
                 component: UuidGenerator,
@@ -60,7 +60,7 @@ const toolsComponents = [
                 keywords: ['locale', 'format', 'iso 8601', 'utc', 'timestamp', 'unix', 'year', 'month', 'day', 'hours', 'minutes', 'seconds']
             },
             {
-                icon: 'fa-arrows-h',
+                icon: 'fa-exchange-alt',
                 text: 'Base converter',
                 path: '/base-converter',
                 component: BaseConverter,
@@ -79,7 +79,7 @@ const toolsComponents = [
                 keywords: ['%20']
             },
             {
-                icon: 'fa-file-image-o',
+                icon: 'fa-file-export',
                 text: 'File to Base64',
                 path: '/file-to-base64',
                 component: FileToBase64
@@ -90,7 +90,7 @@ const toolsComponents = [
         title: 'Miscellaneous',
         child: [
             {
-                icon: 'fa-file-text',
+                icon: 'fa-align-left\n',
                 text: 'Text stats',
                 path: '/text-stats',
                 component: TextStats,