Merge remote-tracking branch 'origin/v3-single' into v3-single

# Conflicts:
#	yarn.lock

src/plugins/vuetify/@core/components/I18n.vue

@@ -1,56 +1,48 @@
 <script setup lang="ts">
-import type { Anchor } from 'vuetify/lib/components'
-import type { I18nLanguage } from '@layouts/types'
+import { Icon } from '@iconify/vue';
+import type { Anchor } from 'vuetify/lib/components';
+import type { I18nLanguage } from '@layouts/types';
 
 const props = withDefaults(defineProps<Props>(), {
   location: 'bottom end',
-})
+});
 
 defineEmits<{
-  (e: 'change', id: string): void
-}>()
+  (e: 'change', id: string): void;
+}>();
 
 interface Props {
-  languages: I18nLanguage[]
-  location?: Anchor
+  languages: I18nLanguage[];
+  location?: Anchor;
 }
 
-const { locale } = useI18n({ useScope: 'global' })
+const { locale } = useI18n({ useScope: 'global' });
 
-watch(locale, val => {
-  document.documentElement.setAttribute('lang', val as string)
-})
+watch(locale, (val) => {
+  document.documentElement.setAttribute('lang', val as string);
+});
 
-const currentLang = ref([localStorage.getItem('lang')|| 'en'])
+const currentLang = ref([localStorage.getItem('lang') || 'en']);
 </script>
 
 <template>
-  <IconBtn>
-    <VIcon icon="mdi-translate" />
-
-    <!-- Menu -->
-    <VMenu
-      activator="parent"
-      :location="props.location"
-      offset="14px"
+  <div class="dropdown dropdown-end">
+    <label tabindex="0" class="btn btn-ghost btn-circle btn-sm mx-1">
+      <Icon icon="mdi-translate" style="font-size: 24px" />
+    </label>
+    <ul
+      tabindex="0"
+      class="dropdown-content menu p-2 shadow bg-base-100 rounded-box w-52"
     >
-      <!-- List -->
-      <VList
-        v-model:selected="currentLang"
-        active-color="primary"
-        min-width="175px"
-      >
-        <!-- List item -->
-        <VListItem
-          v-for="lang in props.languages"
-          :key="lang.i18nLang"
-          :value="lang.i18nLang"
-          @click="locale = lang.i18nLang; $emit('change', lang.i18nLang)"
+      <li v-for="lang in props.languages" :key="lang.i18nLang">
+        <a
+          @click="
+            locale = lang.i18nLang;
+            $emit('change', lang.i18nLang);
+          "
+          >{{ lang.label }}</a
         >
-          <!-- Language label -->
-          <VListItemTitle>{{ lang.label }}</VListItemTitle>
-        </VListItem>
-      </VList>
-    </VMenu>
-  </IconBtn>
+      </li>
+    </ul>
+  </div>
 </template>

src/plugins/vuetify/@layouts/components/VerticalNavLayout.vue

@@ -1,5 +1,6 @@
 <script lang="ts">
-import type { PropType } from 'vue'
+import type { PropType} from 'vue'
+import {h} from 'vue'
 import { useLayouts } from '@layouts'
 import { VerticalNav } from '@layouts/components'
 import type { VerticalNavItems } from '@layouts/types'
@@ -101,17 +102,20 @@ export default defineComponent({
       )
 
       // 👉 Footer
-      const footer = h(
-        'footer',
-        { class: 'layout-footer' },
-        [
-          h(
-            'div',
-            { class: 'footer-content-container' },
-            slots.footer?.(),
-          ),
-        ],
-      )
+      // const footer = h(
+      //   'footer',
+      //   { class: 'layout-footer' },
+      //   [
+      //     h(
+      //       'div',
+      //       { class: 'footer-content-container' },
+      //       slots.footer?.(),
+      //     ),
+      //   ],
+      // )
+
+      const footer = h('footer',{},slots.footer?.())
+      
 
       // 👉 Overlay
       const layoutOverlay = h(