From 0caeafc048d898a84ab15ddcaf5a6ca43a2e202d Mon Sep 17 00:00:00 2001
From: "Peter.Morton" <Peter.Morton@verint.com>
Date: Fri, 14 Jul 2023 00:08:00 +0100
Subject: [PATCH] updated icons

---
 src/App.vue        | 19 ++++++++++++-------
 src/fontawesome.js | 10 ++++++++++
 vite.config.js     |  5 +++++
 3 files changed, 27 insertions(+), 7 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 3de6d01..3dd6da7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -4,6 +4,10 @@ import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
 import { SidebarMenu } from "vue-sidebar-menu";
 import "vue-sidebar-menu/dist/vue-sidebar-menu.css";
 
+const separator = {
+  template: '<hr style="border-color: rgba(0, 0, 0, 0.1); margin: 20px;">',
+}
+
 const faIcon = (props) => {
   return {
     element: markRaw({
@@ -27,27 +31,30 @@ export default {
         {
           href: "/",
           title: "Home",
-          icon: faIcon({ icon: "fa-solid fa-cog" }),
+          icon: faIcon({ icon: "fa-solid fa-house" }),
         },
         {
           href: "/about",
           title: "About",
-          icon: faIcon({ icon: "fa-solid fa-cog" }),
+          icon: faIcon({ icon: "fa-solid fa-question" }),
+        },
+        {
+          component: markRaw(separator),
         },
         {
           href: "/referenceId",
           title: "Contacts Lookup",
-          icon: faIcon({ icon: "fa-solid fa-cog" }),
+          icon: faIcon({ icon: "fa-solid fa-rectangle-list" }),
         },
         {
           href: "/interactionsFlow",
           title: "Interactions Flow",
-          icon: faIcon({ icon: "fa-solid fa-cog" }),
+          icon: faIcon({ icon: "fa-solid fa-route" }),
         },
         {
           href: "/customerAccount/12345",
           title: "Customer Account Example",
-          icon: faIcon({ icon: "fa-solid fa-cog" }),
+          icon: faIcon({ icon: "fa-solid fa-id-card" }),
         },
       ],
       collapsed: false,
@@ -75,8 +82,6 @@ export default {
     v-model:collapsed="collapsed"
     :menu="menu"
     :show-one-child="true"
-    @update:collapsed="onToggleCollapse"
-    @item-click="onItemClick"
   />
   <div id="services" :class="[{ collapsed: collapsed }]">
     <div class="services">
diff --git a/src/fontawesome.js b/src/fontawesome.js
index 82655f1..ebe563f 100644
--- a/src/fontawesome.js
+++ b/src/fontawesome.js
@@ -1,6 +1,11 @@
 import { library } from "@fortawesome/fontawesome-svg-core";
 
 import {
+  faIdCard,
+  faRoute,
+  faHouse,
+  faQuestion,
+  faRectangleList,
   faDownload,
   faCode,
   faCogs,
@@ -14,6 +19,11 @@ import {
 } from "@fortawesome/free-solid-svg-icons";
 
 library.add(
+  faIdCard,
+  faRoute,
+  faRectangleList,
+  faQuestion,
+  faHouse,
   faDownload,
   faCode,
   faCogs,
diff --git a/vite.config.js b/vite.config.js
index 0a8bd80..e7c4261 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -4,4 +4,9 @@ import vue from "@vitejs/plugin-vue";
 // https://vitejs.dev/config/
 export default defineConfig({
   plugins: [vue()],
+  resolve: {
+    alias: {
+      'vue': 'vue/dist/vue.esm-bundler',
+    },
+  }
 });