155 lines
4.1 KiB
Vue
155 lines
4.1 KiB
Vue
<template>
|
|
<div class="border-b border-border">
|
|
<UContainer
|
|
class="w-full max-w-[360px] px-[16px] sm:max-w-[768px] sm:px-[17px] md:max-w-[1000px] md:px-[24px] xl:max-w-[1920px] xl:px-[80px] mx-auto"
|
|
>
|
|
<div class="w-full hidden xl:flex items-center justify-between h-[120px]">
|
|
<ul class="flex items-center gap-20 whitespace-nowrap">
|
|
<li
|
|
v-for="(item, index) in menu.items"
|
|
:key="index"
|
|
class="cursor-pointer hover:text-text-light/80 dark:hover:text-text-dark/70 transition-all text-lg"
|
|
>
|
|
0{{ index + 1 }} <br />
|
|
{{ item.name }}
|
|
</li>
|
|
</ul>
|
|
<img src="./../public/logo.png" alt="Frame" />
|
|
<div class="flex items-center gap-7">
|
|
<UIcon class="w-8 h-8 cursor-pointer" name="i-heroicons-user" />
|
|
<UIcon
|
|
class="w-8 h-8 cursor-pointer"
|
|
name="i-heroicons-shopping-cart"
|
|
/>
|
|
</div>
|
|
<ThemeSwitcher />
|
|
<button
|
|
class="cursor-pointer hover:bg-button-hover transition-all bg-button py-3 px-6 font-medium text-white rounded-xl"
|
|
>
|
|
E-shop
|
|
</button>
|
|
</div>
|
|
<div
|
|
class="w-full hidden md:flex xl:hidden items-center justify-between h-[120px]"
|
|
>
|
|
<img src="./../public/logo.png" alt="Frame" />
|
|
<div class="flex items-center">
|
|
<div class="flex items-center gap-7">
|
|
<UIcon class="w-8 h-8 cursor-pointer" name="i-heroicons-user" />
|
|
<UIcon
|
|
class="w-8 h-8 cursor-pointer"
|
|
name="i-heroicons-shopping-cart"
|
|
/>
|
|
</div>
|
|
<ThemeSwitcher />
|
|
<button
|
|
class="cursor-pointer hover:bg-button-hover transition-all bg-button py-3 px-6 font-medium text-white rounded-xl"
|
|
>
|
|
E-shop
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</UContainer>
|
|
</div>
|
|
</template>
|
|
<script lang="ts" setup>
|
|
const menu = {
|
|
items: [
|
|
{
|
|
active: true,
|
|
created: "2025-04-29 14:21:16.980Z",
|
|
id: "l10y982y139ep7u",
|
|
id_lang: "en",
|
|
id_page: "",
|
|
id_parent: "",
|
|
is_default: false,
|
|
is_root: true,
|
|
link_rewrite: "",
|
|
link_title: "",
|
|
meta_description: "",
|
|
meta_title: "",
|
|
name: "Investice",
|
|
page_name: "",
|
|
position_id: 0,
|
|
updated: "2025-05-09 08:34:06.650Z",
|
|
},
|
|
{
|
|
active: true,
|
|
created: "2025-04-29 14:21:16.980Z",
|
|
id: "l10y982y139ep7u",
|
|
id_lang: "en",
|
|
id_page: "",
|
|
id_parent: "",
|
|
is_default: false,
|
|
is_root: true,
|
|
link_rewrite: "",
|
|
link_title: "",
|
|
meta_description: "",
|
|
meta_title: "",
|
|
name: "O zlotě",
|
|
page_name: "",
|
|
position_id: 0,
|
|
updated: "2025-05-09 08:34:06.650Z",
|
|
},
|
|
{
|
|
active: true,
|
|
created: "2025-04-29 14:21:16.980Z",
|
|
id: "l10y982y139ep7u",
|
|
id_lang: "en",
|
|
id_page: "",
|
|
id_parent: "",
|
|
is_default: false,
|
|
is_root: true,
|
|
link_rewrite: "",
|
|
link_title: "",
|
|
meta_description: "",
|
|
meta_title: "",
|
|
name: "Podnikání",
|
|
page_name: "",
|
|
position_id: 0,
|
|
updated: "2025-05-09 08:34:06.650Z",
|
|
},
|
|
{
|
|
active: true,
|
|
created: "2025-04-29 14:21:16.980Z",
|
|
id: "l10y982y139ep7u",
|
|
id_lang: "en",
|
|
id_page: "",
|
|
id_parent: "",
|
|
is_default: false,
|
|
is_root: true,
|
|
link_rewrite: "",
|
|
link_title: "",
|
|
meta_description: "",
|
|
meta_title: "",
|
|
name: "O Nás",
|
|
page_name: "",
|
|
position_id: 0,
|
|
updated: "2025-05-09 08:34:06.650Z",
|
|
},
|
|
{
|
|
active: true,
|
|
created: "2025-04-29 14:21:16.980Z",
|
|
id: "l10y982y139ep7u",
|
|
id_lang: "en",
|
|
id_page: "",
|
|
id_parent: "",
|
|
is_default: false,
|
|
is_root: true,
|
|
link_rewrite: "",
|
|
link_title: "",
|
|
meta_description: "",
|
|
meta_title: "",
|
|
name: "Kontakt",
|
|
page_name: "",
|
|
position_id: 0,
|
|
updated: "2025-05-09 08:34:06.650Z",
|
|
},
|
|
],
|
|
page: 1,
|
|
perPage: 50,
|
|
totalItems: 14,
|
|
totalPages: 1,
|
|
};
|
|
</script>
|