product page and linter

This commit is contained in:
2025-07-03 11:13:42 +02:00
parent fbb6c071af
commit 90e1d70f64
72 changed files with 12667 additions and 6578 deletions

View File

@ -1,43 +1,59 @@
<template>
<UiContainer class="flex flex-wrap items-center justify-between gap-[30px] sm:gap-y-[55px] xl:gap-y-[100px]">
<div class="w-full flex flex-col gap-[25px] xl:max-w-[48%] md:mx-10 xl:m-0"
v-for="(item, index) in component.front_section_lang[0].data" :key="index">
<UiContainer
class="flex flex-wrap items-center justify-between gap-[30px] sm:gap-y-[55px] xl:gap-y-[100px]"
>
<div
v-for="(item, index) in component.front_section_lang[0].data"
:key="index"
class="w-full flex flex-col gap-[25px] xl:max-w-[48%] md:mx-10 xl:m-0"
>
<!-- xl -->
<div class="hidden xl:flex xl:h-[330px] flex-col justify-between">
<div class="space-y-[55px]">
<h2 class="h2-bold-bounded">{{ item.title }}</h2>
<h2 class="h2-bold-bounded">
{{ item.title }}
</h2>
<p>{{ item.description }}</p>
</div>
<h4 class="h4-uppercase-bold-inter">{{ item.sub_title }}</h4>
<h4 class="h4-uppercase-bold-inter">
{{ item.sub_title }}
</h4>
</div>
<!-- sm/md -->
<div class="xl:hidden flex flex-col gap-y-[25px] sm:gap-y-[55px]">
<h2 class="h2-bold-bounded">{{ item.title }}</h2>
<h2 class="h2-bold-bounded">
{{ item.title }}
</h2>
<p>{{ item.description }}</p>
<h4 class="h4-uppercase-bold-inter">{{ item.sub_title }}</h4>
<h4 class="h4-uppercase-bold-inter">
{{ item.sub_title }}
</h4>
</div>
<UiImgWrapper :src="`/api/public/file/${component.img[index]}_l.webp`">
<template #button>
<UiButtonArrow :arrow="true">{{ item.title }}</UiButtonArrow>
<UiButtonArrow :arrow="true">
{{ item.title }}
</UiButtonArrow>
</template>
</UiImgWrapper>
</div>
<!-- Map block with same layout rules -->
<div class="w-full xl:max-w-[48%] md:mx-10 xl:m-0 flex flex-col gap-4 items-center">
<div
class="w-full xl:max-w-[48%] md:mx-10 xl:m-0 flex flex-col gap-4 items-center"
>
<h1 class="text-sm sm:text-xl uppercase">
Jsme tu pro vás napříč Evropou
</h1>
<MapBlock />
<div class="flex items-center gap-4 w-full justify-end">
<div class="flex items-center gap-2">
<div class="w-3 h-3 rounded-[2.8px] bg-button"></div>
<div class="w-3 h-3 rounded-[2.8px] bg-button" />
<p>Partners</p>
</div>
<div class="flex items-center gap-2">
<div class="w-3 h-3 rounded-[2.8px] bg-block"></div>
<div class="w-3 h-3 rounded-[2.8px] bg-block" />
<p>Customers</p>
</div>
</div>
@ -65,6 +81,6 @@ type Component = {
}
defineProps<{
component: Component;
}>();
component: Component
}>()
</script>