migrate on nuxt3

layouts/UiHeader/UiHeader.vue

@@ -0,0 +1,25 @@
+<template>
+  <header class="py-4 container mx-auto max-2xl:pl-4">
+    <div class="flex flex-row-reverse justify-end gap-4 items-center max-w-[1280px] mx-auto">
+      <slot name="content" />
+      <div class="flex items-center gap-32">
+        <div class="russo-one-regular cursor-pointer !text-primary">
+          <UiParagraph as="span" class="[&]:text-5xl">
+            <RouterLink to="/"> Vino Galante </RouterLink>
+          </UiParagraph>
+        </div>
+        <div class="flex flex-wrap space-x-10">
+          <UiNav :nav-content="headerNavigation" />
+        </div>
+      </div>
+    </div>
+    <slot name="right-icons" />
+  </header>
+</template>
+
+<script setup lang="ts">
+import UiNav from '@/components/UiNav/UiNav.vue'
+import { RouterLink } from 'vue-router'
+import { headerNavigation } from './_data'
+import UiParagraph from '@/components/Typography/UiParagraph.vue'
+</script>

layouts/UiHeader/_data/header-navigation.data.ts

@@ -0,0 +1,24 @@
+const headerNavigation = [
+  {
+    name: 'Главная',
+    path: '/',
+  },
+  {
+    name: 'Книга I',
+    path: '/books/1',
+  },
+  {
+    name: 'Книга II',
+    path: '/books/2',
+  },
+  {
+    name: 'Купить',
+    path: '/buy',
+  },
+  {
+    name: 'Отзывы',
+    path: '/feedback',
+  },
+]
+
+export default headerNavigation

layouts/UiHeader/_data/index.ts

@@ -0,0 +1 @@
+export { default as headerNavigation } from '@/layouts/UiHeader/_data/header-navigation.data'