chore: use some icons from @mdi/js

package.json

@@ -107,6 +107,7 @@
     "@koumoul/vjsf": "2.22.1",
     "@koumoul/vue-multianalytics": "^1.11.4",
     "@mdi/font": "^7.0.96",
+    "@mdi/js": "^7.4.47",
     "@nuxtjs/google-fonts": "^1.3.0",
     "@nuxtjs/vuetify": "^1.12.3",
     "clean-modules": "^2.0.4",

public/components/layout/layout-personal-menu.vue

@@ -14,7 +14,7 @@
           aria-label="symbole de connexion"
           aria-hidden="false"
         >
-          mdi-account-circle
+          {{ mdiAccountCircle }}
         </v-icon>
       </v-btn>
       <v-btn
@@ -92,9 +92,16 @@
 
 <script>
 import { mapState, mapGetters, mapActions } from 'vuex'
+// better to load svg for semantic icons important for accessbility
+import { mdiAccountCircle } from '@mdi/js'
 
 export default {
   props: ['loginHref', 'backgroundDark'],
+  data () {
+    return {
+      mdiAccountCircle
+    }
+  },
   computed: {
     ...mapState(['config', 'textDark', 'userPartners']),
     ...mapState('session', ['user']),

public/components/notifications-queue.vue

@@ -26,7 +26,7 @@
             aria-label="symbole de notification"
             aria-hidden="false"
           >
-            mdi-bell
+            {{ mdiBell }}
           </v-icon>
         </v-badge>
       </v-btn>
@@ -86,6 +86,8 @@
 <script>
 import { mapState } from 'vuex'
 import eventBus from '~/event-bus'
+import { mdiBelll } from '@mdi/js'
+
 /* let sound
 if (!process.server) {
   sound = new Audio(require('@/assets/sounds/Information_Block.ogg'))
@@ -98,7 +100,8 @@ export default {
     countNew: null,
     notifications: null,
     loading: false,
-    size: 10
+    size: 10,
+    mdiBelll
   }),
   computed: {
     ...mapState(['textDark', 'config']),