Use span tags to all icons

src/components/layout/app-navbar/AppNavbar.vue

@@ -2,7 +2,7 @@
 
   <vuestic-navbar>
     <header-selector slot="selector" v-model="valueProxy"/>
-    <i slot="logo" class="i-vuestic"></i>
+    <span slot="logo" class="i-vuestic"></span>
     <div slot="center" class="navbar-text offset-md-1 col-md-7 d-none d-lg-flex align-items-center justify-content-center">
       {{$t('navbar.messageUs')}}&nbsp;<a href="mailto:[email protected]">[email protected]</a>
     </div>

src/components/layout/app-navbar/components/HeaderSelector.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="header-selector-container"
+  <span class="header-selector-container"
        :class="{ 'i-menu-expanded': !value, 'i-menu-collapsed': value }"
        @click="onClick()"
   />

src/components/layout/app-navbar/components/dropdowns/LanguageDropdown.vue

@@ -1,12 +1,12 @@
 <template>
   <div class="language-selector dropdown" v-dropdown.closeOnMenuClick>
     <a class="language-selector-button dropdown-toggle" href="#">
-      <i class="flag-icon flag-icon-large" :class="flagIconClass(currentLanguage())"></i>
+      <span class="flag-icon flag-icon-large" :class="flagIconClass(currentLanguage())"></span>
     </a>
     <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
       <a class="dropdown-item" :class="{ active: option.code === currentLanguage() }"
         v-for="(option, id) in options" :key="id" @click="setLanguage(option.code)">
-        <i class="flag-icon flag-icon-small" :class="flagIconClass(option.code)"></i>
+        <span class="flag-icon flag-icon-small" :class="flagIconClass(option.code)"></span>
         <span class="dropdown-item-text ellipsis">
           {{ `language.${option.name}` | translate }}
         </span>