add map/products

This commit is contained in:
Arina Yakovenko 2025-06-03 15:20:55 +02:00
parent 2ffd64da98
commit c9348dc092
17 changed files with 572 additions and 46 deletions

View File

@ -20,15 +20,30 @@
</div> </div>
</div> </div>
<img <ClientOnly v-if="!colorMode?.forced">
class="w-[70%] sm:w-[50%] xl:w-[30%]" <img
src="/public/logo-footer.svg" class="cursor-pointer w-[70%] sm:w-[50%] xl:w-[30%]"
alt="logo-footer" :src="isDark ? '/logo-footer-dark.svg' : '/logo-footer.svg'"
/> alt="logo"
@click="menuStore.navigateToItem()"
/>
</ClientOnly>
</UiContainer> </UiContainer>
</div> </div>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const menuStore = useMenuStore(); const menuStore = useMenuStore();
const store = useStore();
const open = ref(false);
const colorMode = useColorMode();
const isDark = computed({
get() {
return colorMode.value === "dark";
},
set(_isDark) {
colorMode.preference = _isDark ? "dark" : "light";
},
});
</script> </script>

View File

@ -20,7 +20,7 @@
<ClientOnly v-if="!colorMode?.forced"> <ClientOnly v-if="!colorMode?.forced">
<img <img
class="cursor-pointer" class="cursor-pointer"
:src="isDark ? '/logo-dark.png' : '/logo.png'" :src="isDark ? '/logo-dark.svg' : '/logo.svg'"
alt="logo" alt="logo"
@click="menuStore.navigateToItem()" @click="menuStore.navigateToItem()"
/> />
@ -51,19 +51,22 @@
<ClientOnly v-if="!colorMode?.forced"> <ClientOnly v-if="!colorMode?.forced">
<img <img
class="cursor-pointer" class="cursor-pointer"
:src="isDark ? '/logo-dark.png' : '/logo.png'" :src="isDark ? '/logo-dark.svg' : '/logo.svg'"
alt="logo" alt="logo"
@click="menuStore.navigateToItem()" @click="menuStore.navigateToItem()"
/> />
</ClientOnly> </ClientOnly>
<div class="flex items-center gap-6"> <div class="flex items-center gap-6">
<i class="uil uil-user text-[35px] cursor-pointer"></i> <div class="flex items-center gap-[30px]">
<i class="uil uil-shopping-cart text-[35px] cursor-pointer"></i> <i class="uil uil-user text-[31px] cursor-pointer"></i>
<i class="uil uil-shopping-cart text-[31px] cursor-pointer"></i>
</div>
<LangSwitcher />
<ThemeSwitcher /> <ThemeSwitcher />
<i <i
variant="subtle" variant="subtle"
block block
class="uil uil-apps text-[35px] cursor-pointer" class="uil uil-apps text-[33px] cursor-pointer"
@click="open = !open" @click="open = !open"
></i> ></i>
</div> </div>
@ -122,18 +125,20 @@
<ClientOnly v-if="!colorMode?.forced"> <ClientOnly v-if="!colorMode?.forced">
<img <img
class="cursor-pointer" class="cursor-pointer"
:src="isDark ? '/logo-dark.png' : '/logo.png'" :src="isDark ? '/logo-dark.svg' : '/logo.svg'"
alt="logo" alt="logo"
@click="menuStore.navigateToItem()" @click="menuStore.navigateToItem()"
/> />
</ClientOnly> </ClientOnly>
<div class="flex items-center gap-6"> <div class="flex items-center gap-6">
<i class="uil uil-user text-[35px] cursor-pointer"></i> <div class="flex items-center gap-[30px]">
<i class="uil uil-shopping-cart text-[35px] cursor-pointer"></i> <i class="uil uil-user text-[31px] cursor-pointer"></i>
<i class="uil uil-shopping-cart text-[31px] cursor-pointer"></i>
</div>
<i <i
variant="subtle" variant="subtle"
block block
class="uil uil-apps text-[35px] cursor-pointer" class="uil uil-apps text-[30px] cursor-pointer"
@click="open = !open" @click="open = !open"
></i> ></i>
</div> </div>
@ -177,6 +182,18 @@
/> />
</svg> </svg>
</div> </div>
<div class="flex items-center justify-between">
<p class="text-inter leading-[70%] text-lg">
{{ $t("change_language") }}
</p>
<LangSwitcher />
</div>
<div class="flex items-center justify-between">
<p class="text-inter leading-[70%] text-lg">
{{ $t("change_theme") }}
</p>
<ThemeSwitcher />
</div>
</UiContainer> </UiContainer>
</div> </div>
</template> </template>
@ -190,17 +207,17 @@
<ClientOnly v-if="!colorMode?.forced"> <ClientOnly v-if="!colorMode?.forced">
<img <img
class="cursor-pointer" class="cursor-pointer"
:src="isDark ? '/logo-dark.png' : '/logo.png'" :src="isDark ? '/logo-dark.svg' : '/logo.svg'"
alt="logo" alt="logo"
@click="menuStore.navigateToItem()" @click="menuStore.navigateToItem()"
/> />
</ClientOnly> </ClientOnly>
<div class="flex items-center gap-6"> <div class="flex items-center gap-6">
<i class="uil uil-shopping-cart text-[35px] cursor-pointer"></i> <i class="uil uil-shopping-cart text-[31px] cursor-pointer"></i>
<i <i
variant="subtle" variant="subtle"
block block
class="uil uil-apps text-[35px] cursor-pointer" class="uil uil-apps text-[30px] cursor-pointer"
@click="open = !open" @click="open = !open"
></i> ></i>
</div> </div>
@ -244,6 +261,18 @@
/> />
</svg> </svg>
</div> </div>
<div class="flex items-center justify-between">
<p class="text-inter leading-[70%] text-lg">
{{ $t("change_language") }}
</p>
<LangSwitcher />
</div>
<div class="flex items-center justify-between">
<p class="text-inter leading-[70%] text-lg">
{{ $t("change_theme") }}
</p>
<ThemeSwitcher />
</div>
</UiContainer> </UiContainer>
</div> </div>
</template> </template>

47
components/ImageBlock.vue Normal file
View File

@ -0,0 +1,47 @@
<template>
<div
class="h-[235px] sm:h-[350px] w-full rounded-[20px] bg-cover bg-center transition-transform duration-300 group-hover:scale-105 xl:block relative"
>
<!-- <svg
class=""
viewBox="0 0 870 350"
fill="none"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<path
d="M0 20C0 8.9543 8.95431 0 20 0H847.666C858.641 0 867.565 8.84318 867.665 19.817L869.815 254.817C869.917 265.934 860.933 275 849.816 275H653C641.954 275 633 283.954 633 295V330C633 341.046 624.046 350 613 350H20C8.95431 350 0 341.046 0 330V20Z"
fill="url(#pattern0_381_6471)"
/>
<defs>
<pattern
id="pattern0_381_6471"
patternContentUnits="objectBoundingBox"
width="1"
height="1"
>
<use
xlink:href="#image0_381_6471"
transform="matrix(0.000732064 0 0 0.0018197 0 -0.198766)"
/>
</pattern>
<image
id="image0_381_6471"
width="1366"
height="768"
preserveAspectRatio="none"
xlink:href="/block.webp"
/>
</defs>
</svg> -->
<img class="image" src="/block.webp" alt="">
<slot />
</div>
</template>
<script lang="ts" setup></script>
<style>
.image {
clip-path: path("M0 20C0 8.9543 8.95431 0 20 0H847.666C858.641 0 867.565 8.84318 867.665 19.817L869.815 254.817C869.917 265.934 860.933 275 849.816 275H653C641.954 275 633 283.954 633 295V330C633 341.046 624.046 350 613 350H20C8.95431 350 0 341.046 0 330V20Z");
}
</style>

297
components/MapBlock.vue Normal file

File diff suppressed because one or more lines are too long

View File

@ -34,16 +34,31 @@
<div <div
class="hidden sm:block absolute bottom-0 right-0 pt-2 pl-2 bg-bg-light dark:bg-bg-dark rounded-tl-2xl" class="hidden sm:block absolute bottom-0 right-0 pt-2 pl-2 bg-bg-light dark:bg-bg-dark rounded-tl-2xl"
> >
<ButtonArrow>{{ item.title }}</ButtonArrow> <UiButtonArrow>{{ item.title }}</UiButtonArrow>
</div>
</div>
<UiButtonArrow class="sm:hidden mx-auto">{{ item.title }}</UiButtonArrow>
</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">
<h1>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-2 h-2 rounded-[2px] bg-accent-green"></div>
<p>Partners</p>
</div>
<div class="flex items-center gap-2">
<div class="w-2 h-2 rounded-[2px] bg-accent-green"></div>
<p>Customers</p>
</div> </div>
</div> </div>
<ButtonArrow class="sm:hidden mx-auto">{{ item.title }}</ButtonArrow>
</div> </div>
</UiContainer> </UiContainer>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
const props = defineProps<{ component: Component }>();
type Component = { type Component = {
image_collection: string; image_collection: string;
section_id: string; section_id: string;
@ -56,4 +71,33 @@ type Component = {
} }
]; ];
}; };
interface Partner {
code: string;
country_iso: string;
region_iso: string;
first_name: string;
last_name: string;
job_position: string;
commissioning_entity_name: string;
}
const props = defineProps<{
component: Component;
data: Object;
infoData: Object;
}>();
const countryISOs = ref("");
const isDefault = ref<boolean>(true);
const activeCountry = ref<string>("");
let partnersList = ref([] as Partner[]);
let partnersCountries = ref([] as any[]);
const backToEurope = () => {
isDefault.value = true;
activeCountry.value = "";
partnersList.value = [];
};
</script> </script>

View File

@ -19,9 +19,9 @@
{{ component.section_lang_data.title_second }} {{ component.section_lang_data.title_second }}
</h3> </h3>
<div class="flex w-full items-start justify-center sm:justify-end"> <div class="flex w-full items-start justify-center sm:justify-end">
<ButtonArrow type="fill">{{ <UiButtonArrow type="fill">{{
component.section_lang_data.button component.section_lang_data.button
}}</ButtonArrow> }}</UiButtonArrow>
</div> </div>
</div> </div>
</div> </div>

View File

@ -2,25 +2,36 @@
<UiContainer class="space-y-[40px] sm:space-y-[55px] md:space-y-[75px]"> <UiContainer class="space-y-[40px] sm:space-y-[55px] md:space-y-[75px]">
<div <div
:class="[ :class="[
'sm:mx-[50px] md:mx-0 xl:mx-[92px] flex items-center', 'sm:mx-[50px] md:mx-0 xl:mx-[92px] flex items-stretch',
itemCount === 1 ? 'justify-center' : 'justify-between', itemCount === 1 ? 'justify-center' : 'justify-between gap-2',
]" ]"
> >
<!-- product -->
<div <div
v-for="item in itemCount" v-for="(item, index) in productStore.productList"
:key="item" :key="index"
class="w-[200px] sm:w-[260px] md:w-[290px] py-[15px] px-[10px] sm:py-5 sm:px-[14px] bg-button-white rounded-2xl flex flex-col items-center gap-5 sm:gap-7" class="w-[200px] sm:w-[260px] md:w-[290px] sm:py-5 sm:px-[15px] py-[15px] px-[10px] bg-button-white rounded-2xl flex flex-col items-center gap-5 sm:gap-7"
> >
<img src="/pics.png" alt="pics" class="max-w-[150px]" /> <img
<div class="flex flex-col gap-[10px] sm:gap-[15px] w-full"> :src="`https://www.yourgold.cz/api/public/file/${item.cover_picture_uuid}.webp`"
<h3 class="text-[13px] sm:text-[16px] text-xl font-bold"> alt="pics"
50g Zlatý slitek: PAMP Suisse class="max-h-[150px] sm:max-h-[180px] md:max-h-[205px]"
</h3> />
<p class="text-[10px] sm:text-[12px] text-sm text-bg-dark"> <div class="flex flex-col justify-between h-full">
Osvobozená sazba DPH PL <div class="flex flex-col gap-[10px] sm:gap-[15px] w-full">
</p> <h3
class="text-[13px] sm:text-base md:text-lg text-xl font-bold leading-[150%] text-bg-dark"
>
{{ item.name }}
</h3>
<p class="text-[10px] sm:text-[12px] text-sm text-bg-dark">
{{ item.tax_name }}
</p>
</div>
<div class="flex items-center justify-between"> <div class="flex items-center justify-between">
<p class="text-accent-green text-bold-24"> 4,825.44</p> <p class="text-accent-green text-bold-24">
{{ item.formatted_price }}
</p>
<button <button
class="w-9 h-9 md:w-12 md:h-12 rounded-xl bg-button cursor-pointer hover:bg-button-hover transition-all flex items-center justify-center" class="w-9 h-9 md:w-12 md:h-12 rounded-xl bg-button cursor-pointer hover:bg-button-hover transition-all flex items-center justify-center"
> >
@ -39,7 +50,7 @@
Zlato je jistota, která nepodléhá času. Udělejte dnes rozhodnutí, které Zlato je jistota, která nepodléhá času. Udělejte dnes rozhodnutí, které
vás ochrání zítra vás ochrání zítra
</h3> </h3>
<ButtonArrow type="fill">E-shop</ButtonArrow> <UiButtonArrow type="fill">E-shop</UiButtonArrow>
</div> </div>
</UiContainer> </UiContainer>
</template> </template>
@ -61,19 +72,27 @@ type Component = {
]; ];
}; };
const itemCount = ref(1); const itemCount = ref(4);
const productStore = useProductStore();
function updateItemCount() { async function updateItemCount() {
const width = window.innerWidth; const width = window.innerWidth;
if (width >= 1280) itemCount.value = 5; if (width >= 1800) itemCount.value = 5;
else if (width >= 1200) itemCount.value = 4;
else if (width >= 768) itemCount.value = 3; else if (width >= 768) itemCount.value = 3;
else if (width >= 640) itemCount.value = 2; else if (width >= 640) itemCount.value = 2;
else itemCount.value = 1; else itemCount.value = 1;
} }
onMounted(() => { watch(itemCount, async() => {
updateItemCount(); await productStore.getList(itemCount.value);
});
onMounted(async () => {
await updateItemCount();
window.addEventListener("resize", updateItemCount); window.addEventListener("resize", updateItemCount);
await productStore.getList(itemCount.value);
}); });
onBeforeUnmount(() => { onBeforeUnmount(() => {

View File

@ -3,6 +3,13 @@
class="bg-bg-light dark:bg-bg-dark text-text-light dark:text-text-dark font-inter flex min-h-screen flex-col overflow-hidden" class="bg-bg-light dark:bg-bg-dark text-text-light dark:text-text-dark font-inter flex min-h-screen flex-col overflow-hidden"
> >
<HeaderBlock /> <HeaderBlock />
<!-- <ImageBlock>
<div
class="hidden sm:block absolute bottom-0 right-0 pt-2 pl-2 bg-bg-light dark:bg-bg-dark rounded-tl-2xl"
>
<UiButtonArrow>Title</UiButtonArrow>
</div>
</ImageBlock> -->
<div class="flex-1 py-[25px] sm:py-[55px] md:py-[75px]"> <div class="flex-1 py-[25px] sm:py-[55px] md:py-[75px]">
<slot /> <slot />
</div> </div>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1008 B

14
public/logo-dark.svg Normal file
View File

@ -0,0 +1,14 @@
<svg width="95" height="48" viewBox="0 0 95 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.3 35L4.57999 39.6917L6.70002 35H9L5.60002 42.1549V48H3.46V42.1155L0 35H2.3Z" fill="#FFFEFB"/>
<path d="M24 41.5001C24 43.2642 23.2178 45.0099 21.8954 46.2542C20.6848 47.4057 19.1389 48 17.3696 48C13.7937 48 11 45.1584 11 41.463C11 39.8657 11.6705 38.2131 12.8439 36.95C13.9799 35.7243 15.6748 35 17.4441 35C21.0387 35 24 37.9344 24 41.5001ZM13.1605 41.5001C13.1605 42.9672 13.6447 44.1 14.6318 44.9542C15.4327 45.6599 16.4756 46.05 17.4814 46.05C19.9399 46.05 21.8209 44.0813 21.8209 41.5371C21.8209 38.9928 19.9212 36.95 17.5 36.95C15.0788 36.95 13.1605 38.9184 13.1605 41.5001Z" fill="#FFFEFB"/>
<path d="M28.0385 35V43.4813C28.0385 44.3623 28.0962 44.7645 28.2693 45.0899C28.5769 45.7214 29.1923 46.0661 29.9615 46.0661C30.8077 46.0661 31.4423 45.6639 31.7308 44.9364C31.9231 44.4579 31.9423 44.2474 31.9423 43.0029V35H34V43.2516C34 44.5154 33.9038 45.1855 33.6154 45.7788C32.9807 47.1576 31.6153 48 30.0193 48C28.4231 48 27 47.1001 26.3654 45.6832C26.077 45.0706 26 44.4961 26 43.2134V35H28.0385Z" fill="#FFFEFB"/>
<path d="M38.6855 35C39.8134 35 40.6011 35.1747 41.2278 35.5627C42.3197 36.2224 42.9465 37.4062 42.9465 38.803C42.9465 40.6269 41.9261 42.0625 40.2072 42.7224L43 46.8552L41.4426 48L37.9335 42.7998V47.8836H36V35H38.6855ZM38.6855 40.918C39.33 40.918 39.5269 40.8985 39.7954 40.7821C40.4757 40.491 40.8875 39.7341 40.8875 38.7835C40.8875 37.6 40.1714 36.9015 38.954 36.9015H37.9514V40.8985H38.6855V40.918Z" fill="#FFFEFB"/>
<path d="M61 40.6995V46.4749C59.6786 47.4852 58.2016 48 56.608 48C52.915 48 50 45.1215 50 41.4618C50 37.8021 52.8764 35 56.5495 35C57.7352 35 58.9981 35.3241 59.9507 35.8578L59.5425 37.8593C58.7069 37.3446 57.3851 36.9824 56.3358 36.9824C54.0618 36.9824 52.2736 39.06 52.2736 41.6142C52.2736 44.1683 54.1394 46.151 56.5495 46.151C57.5211 46.151 58.4928 45.903 58.9596 45.5218V42.5485H55.772L56.1802 40.6995H61Z" fill="#FFFEFB"/>
<path d="M76 41.5001C76 43.2642 75.2175 45.0099 73.8952 46.2542C72.6849 47.4057 71.1391 48 69.3694 48C65.7939 48 63 45.1584 63 41.463C63 39.8657 63.6707 38.2131 64.844 36.95C65.9799 35.7243 67.6749 35 69.4445 35C73.0387 35 76 37.9344 76 41.5001ZM65.1605 41.5001C65.1605 42.9672 65.6448 44.1 66.632 44.9542C67.4327 45.6599 68.476 46.05 69.4815 46.05C71.9398 46.05 73.8208 44.0813 73.8208 41.5371C73.8208 38.9928 71.9211 36.95 69.5002 36.95C67.0789 36.95 65.1605 38.9184 65.1605 41.5001Z" fill="#FFFEFB"/>
<path d="M80.1695 35V46.084H84V48H78V35.0196H80.1695V35Z" fill="#FFFEFB"/>
<path d="M88.7465 35C89.8224 35 90.6202 35.1568 91.4181 35.549C93.5711 36.5882 95 39 95 41.6076C95 44.2157 93.478 46.7056 91.1586 47.5684C90.3235 47.8823 89.5998 48 88.5979 48H86V35.0195H88.7465V35ZM88.4121 46.0391C89.08 46.0391 89.5257 45.9803 89.9896 45.8235C91.7524 45.255 92.9214 43.5294 92.9214 41.5488C92.9214 39.4119 91.5852 37.6077 89.6738 37.098C89.2286 36.9804 88.9136 36.9412 88.2636 36.9412H87.9855L87.9669 46.0391H88.4121Z" fill="#FFFEFB"/>
<path d="M60 0H53V25H60V0Z" fill="#008567"/>
<path d="M50 2H43V25H50V2Z" fill="#D3E0DE"/>
<path d="M40 5H33V25H40V5Z" fill="#E8E7E0"/>
<path d="M76 29H19V30H76V29Z" fill="#FFFEFB"/>
</svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

View File

@ -0,0 +1,10 @@
<svg width="596" height="94" viewBox="0 0 596 94" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.2667 1.5L24.4266 27.124L35.7334 1.5H48L29.8668 40.5766V72.5H18.4533V40.3615L0 1.5H12.2667Z" fill="#FFFEFB"/>
<path d="M142 37.0003C142 47.0421 137.547 56.9797 130.02 64.0624C123.129 70.6173 114.329 74 104.258 74C83.9024 74 68 57.8248 68 36.7896C68 27.6972 71.8164 18.2898 78.4958 11.0999C84.9627 4.12274 94.6103 0 104.682 0C125.143 0 142 16.7038 142 37.0003ZM80.298 37.0003C80.298 45.3519 83.0546 51.8002 88.6732 56.6625C93.232 60.6797 99.1691 62.9001 104.894 62.9001C118.888 62.9001 129.596 51.6937 129.596 37.211C129.596 22.7284 118.782 11.0999 105 11.0999C91.2178 11.0999 80.298 22.3047 80.298 37.0003Z" fill="#FFFEFB"/>
<path d="M173.212 1V47.9736C173.212 52.853 173.529 55.0802 174.481 56.8824C176.173 60.38 179.558 62.289 183.788 62.289C188.442 62.289 191.933 60.0618 193.519 56.0324C194.577 53.3825 194.683 52.2166 194.683 45.3237V1H206V46.7009C206 53.7007 205.471 57.4119 203.885 60.6981C200.394 68.3342 192.884 73 184.106 73C175.327 73 167.5 68.0161 164.01 60.1686C162.423 56.7756 162 53.5938 162 46.4896V1H173.212Z" fill="#FFFEFB"/>
<path d="M242.113 1.5C248.88 1.5 253.607 2.45412 257.367 4.57337C263.918 8.17616 267.679 14.6413 267.679 22.2703C267.679 32.2317 261.556 40.0719 251.243 43.6763L268 66.2474L258.656 72.5L237.601 44.0987V71.8641H226V1.5H242.113ZM242.113 33.8216C245.98 33.8216 247.162 33.7148 248.773 33.0789C252.854 31.4891 255.325 27.3555 255.325 22.1635C255.325 15.6997 251.028 11.8852 243.724 11.8852H237.708V33.7148H242.113V33.8216Z" fill="#FFFEFB"/>
<path d="M378 32.5663V64.5535C370.792 70.149 362.736 73 354.043 73C333.9 73 318 57.0573 318 36.7884C318 16.5196 333.69 1 353.724 1C360.192 1 367.081 2.79497 372.277 5.7509L370.05 16.8363C365.492 13.9854 358.282 11.9795 352.559 11.9795C340.155 11.9795 330.401 23.4863 330.401 37.6324C330.401 51.7785 340.578 62.7592 353.724 62.7592C359.024 62.7592 364.324 61.3858 366.87 59.2747V42.8071H349.483L351.71 32.5663H378Z" fill="#E8E7E0"/>
<path d="M472 37.0003C472 47.0421 467.546 56.9797 460.019 64.0624C453.129 70.6173 444.33 74 434.257 74C413.904 74 398 57.8248 398 36.7896C398 27.6972 401.818 18.2898 408.497 11.0999C414.963 4.12274 424.611 0 434.684 0C455.144 0 472 16.7038 472 37.0003ZM410.298 37.0003C410.298 45.3519 413.055 51.8002 418.674 56.6625C423.232 60.6797 429.171 62.9001 434.895 62.9001C448.888 62.9001 459.595 51.6937 459.595 37.211C459.595 22.7284 448.782 11.0999 435.001 11.0999C421.218 11.0999 410.298 22.3047 410.298 37.0003Z" fill="#E8E7E0"/>
<path d="M503.571 1.5V62.0358H524V72.5H492V1.60709H503.571V1.5Z" fill="#E8E7E0"/>
<path d="M559.868 1.5C566.085 1.5 570.695 2.35658 575.304 4.49821C587.744 10.1738 596 23.3463 596 37.5879C596 51.8318 587.206 65.4308 573.805 70.1428C568.98 71.8574 564.799 72.5 559.01 72.5H544V1.60673H559.868V1.5ZM557.937 61.7907C561.796 61.7907 564.371 61.4693 567.051 60.6132C577.236 57.5078 583.99 48.0838 583.99 37.2666C583.99 25.5956 576.27 15.7423 565.227 12.9583C562.654 12.3158 560.834 12.1017 557.078 12.1017H555.472L555.364 61.7907H557.937Z" fill="#E8E7E0"/>
</svg>

After

Width:  |  Height:  |  Size: 3.0 KiB

View File

@ -1,8 +1,8 @@
<svg width="596" height="94" viewBox="0 0 596 94" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="596" height="94" viewBox="0 0 596 94" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12.2667 1.5L24.4266 27.124L35.7334 1.5H48L29.8668 40.5766V72.5H18.4533V40.3615L0 1.5H12.2667Z" fill="#FFFEFB"/> <path d="M12.2667 1.5L24.4266 27.124L35.7334 1.5H48L29.8668 40.5766V72.5H18.4533V40.3615L0 1.5H12.2667Z" fill="#1A1A1A"/>
<path d="M142 37.0003C142 47.0421 137.547 56.9797 130.02 64.0624C123.129 70.6173 114.329 74 104.258 74C83.9024 74 68 57.8248 68 36.7896C68 27.6972 71.8164 18.2898 78.4958 11.0999C84.9627 4.12274 94.6103 0 104.682 0C125.143 0 142 16.7038 142 37.0003ZM80.298 37.0003C80.298 45.3519 83.0546 51.8002 88.6732 56.6625C93.232 60.6797 99.1691 62.9001 104.894 62.9001C118.888 62.9001 129.596 51.6937 129.596 37.211C129.596 22.7284 118.782 11.0999 105 11.0999C91.2178 11.0999 80.298 22.3047 80.298 37.0003Z" fill="#FFFEFB"/> <path d="M142 37.0003C142 47.0421 137.547 56.9797 130.02 64.0624C123.129 70.6173 114.329 74 104.258 74C83.9024 74 68 57.8248 68 36.7896C68 27.6972 71.8164 18.2898 78.4958 11.0999C84.9627 4.12274 94.6103 0 104.682 0C125.143 0 142 16.7038 142 37.0003ZM80.298 37.0003C80.298 45.3519 83.0546 51.8002 88.6732 56.6625C93.232 60.6797 99.1691 62.9001 104.894 62.9001C118.888 62.9001 129.596 51.6937 129.596 37.211C129.596 22.7284 118.782 11.0999 105 11.0999C91.2178 11.0999 80.298 22.3047 80.298 37.0003Z" fill="#1A1A1A"/>
<path d="M173.212 1V47.9736C173.212 52.853 173.529 55.0802 174.481 56.8824C176.173 60.38 179.558 62.289 183.788 62.289C188.442 62.289 191.933 60.0618 193.519 56.0324C194.577 53.3825 194.683 52.2166 194.683 45.3237V1H206V46.7009C206 53.7007 205.471 57.4119 203.885 60.6981C200.394 68.3342 192.884 73 184.106 73C175.327 73 167.5 68.0161 164.01 60.1686C162.423 56.7756 162 53.5938 162 46.4896V1H173.212Z" fill="#FFFEFB"/> <path d="M173.212 1V47.9736C173.212 52.853 173.529 55.0802 174.481 56.8824C176.173 60.38 179.558 62.289 183.788 62.289C188.442 62.289 191.933 60.0618 193.519 56.0324C194.577 53.3825 194.683 52.2166 194.683 45.3237V1H206V46.7009C206 53.7007 205.471 57.4119 203.885 60.6981C200.394 68.3342 192.884 73 184.106 73C175.327 73 167.5 68.0161 164.01 60.1686C162.423 56.7756 162 53.5938 162 46.4896V1H173.212Z" fill="#1A1A1A"/>
<path d="M242.113 1.5C248.88 1.5 253.607 2.45412 257.367 4.57337C263.918 8.17616 267.679 14.6413 267.679 22.2703C267.679 32.2317 261.556 40.0719 251.243 43.6763L268 66.2474L258.656 72.5L237.601 44.0987V71.8641H226V1.5H242.113ZM242.113 33.8216C245.98 33.8216 247.162 33.7148 248.773 33.0789C252.854 31.4891 255.325 27.3555 255.325 22.1635C255.325 15.6997 251.028 11.8852 243.724 11.8852H237.708V33.7148H242.113V33.8216Z" fill="#FFFEFB"/> <path d="M242.113 1.5C248.88 1.5 253.607 2.45412 257.367 4.57337C263.918 8.17616 267.679 14.6413 267.679 22.2703C267.679 32.2317 261.556 40.0719 251.243 43.6763L268 66.2474L258.656 72.5L237.601 44.0987V71.8641H226V1.5H242.113ZM242.113 33.8216C245.98 33.8216 247.162 33.7148 248.773 33.0789C252.854 31.4891 255.325 27.3555 255.325 22.1635C255.325 15.6997 251.028 11.8852 243.724 11.8852H237.708V33.7148H242.113V33.8216Z" fill="#1A1A1A"/>
<path d="M378 32.5663V64.5535C370.792 70.149 362.736 73 354.043 73C333.9 73 318 57.0573 318 36.7884C318 16.5196 333.69 1 353.724 1C360.192 1 367.081 2.79497 372.277 5.7509L370.05 16.8363C365.492 13.9854 358.282 11.9795 352.559 11.9795C340.155 11.9795 330.401 23.4863 330.401 37.6324C330.401 51.7785 340.578 62.7592 353.724 62.7592C359.024 62.7592 364.324 61.3858 366.87 59.2747V42.8071H349.483L351.71 32.5663H378Z" fill="#9A7F62"/> <path d="M378 32.5663V64.5535C370.792 70.149 362.736 73 354.043 73C333.9 73 318 57.0573 318 36.7884C318 16.5196 333.69 1 353.724 1C360.192 1 367.081 2.79497 372.277 5.7509L370.05 16.8363C365.492 13.9854 358.282 11.9795 352.559 11.9795C340.155 11.9795 330.401 23.4863 330.401 37.6324C330.401 51.7785 340.578 62.7592 353.724 62.7592C359.024 62.7592 364.324 61.3858 366.87 59.2747V42.8071H349.483L351.71 32.5663H378Z" fill="#9A7F62"/>
<path d="M472 37.0003C472 47.0421 467.546 56.9797 460.019 64.0624C453.129 70.6173 444.33 74 434.257 74C413.904 74 398 57.8248 398 36.7896C398 27.6972 401.818 18.2898 408.497 11.0999C414.963 4.12274 424.611 0 434.684 0C455.144 0 472 16.7038 472 37.0003ZM410.298 37.0003C410.298 45.3519 413.055 51.8002 418.674 56.6625C423.232 60.6797 429.171 62.9001 434.895 62.9001C448.888 62.9001 459.595 51.6937 459.595 37.211C459.595 22.7284 448.782 11.0999 435.001 11.0999C421.218 11.0999 410.298 22.3047 410.298 37.0003Z" fill="#9A7F62"/> <path d="M472 37.0003C472 47.0421 467.546 56.9797 460.019 64.0624C453.129 70.6173 444.33 74 434.257 74C413.904 74 398 57.8248 398 36.7896C398 27.6972 401.818 18.2898 408.497 11.0999C414.963 4.12274 424.611 0 434.684 0C455.144 0 472 16.7038 472 37.0003ZM410.298 37.0003C410.298 45.3519 413.055 51.8002 418.674 56.6625C423.232 60.6797 429.171 62.9001 434.895 62.9001C448.888 62.9001 459.595 51.6937 459.595 37.211C459.595 22.7284 448.782 11.0999 435.001 11.0999C421.218 11.0999 410.298 22.3047 410.298 37.0003Z" fill="#9A7F62"/>
<path d="M503.571 1.5V62.0358H524V72.5H492V1.60709H503.571V1.5Z" fill="#9A7F62"/> <path d="M503.571 1.5V62.0358H524V72.5H492V1.60709H503.571V1.5Z" fill="#9A7F62"/>

Before

Width:  |  Height:  |  Size: 3.0 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.3 KiB

14
public/logo.svg Normal file
View File

@ -0,0 +1,14 @@
<svg width="95" height="48" viewBox="0 0 95 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M2.3 35L4.57999 39.6917L6.70002 35H9L5.60002 42.1549V48H3.46V42.1155L0 35H2.3Z" fill="#1A1A1A"/>
<path d="M24 41.5001C24 43.2642 23.2178 45.0099 21.8954 46.2542C20.6848 47.4057 19.1389 48 17.3696 48C13.7937 48 11 45.1584 11 41.463C11 39.8657 11.6705 38.2131 12.8439 36.95C13.9799 35.7243 15.6748 35 17.4441 35C21.0387 35 24 37.9344 24 41.5001ZM13.1605 41.5001C13.1605 42.9672 13.6447 44.1 14.6318 44.9542C15.4327 45.6599 16.4756 46.05 17.4814 46.05C19.9399 46.05 21.8209 44.0813 21.8209 41.5371C21.8209 38.9928 19.9212 36.95 17.5 36.95C15.0788 36.95 13.1605 38.9184 13.1605 41.5001Z" fill="#1A1A1A"/>
<path d="M28.0385 35V43.4813C28.0385 44.3623 28.0962 44.7645 28.2693 45.0899C28.5769 45.7214 29.1923 46.0661 29.9615 46.0661C30.8077 46.0661 31.4423 45.6639 31.7308 44.9364C31.9231 44.4579 31.9423 44.2474 31.9423 43.0029V35H34V43.2516C34 44.5154 33.9038 45.1855 33.6154 45.7788C32.9807 47.1576 31.6153 48 30.0193 48C28.4231 48 27 47.1001 26.3654 45.6832C26.077 45.0706 26 44.4961 26 43.2134V35H28.0385Z" fill="#1A1A1A"/>
<path d="M38.6855 35C39.8134 35 40.6011 35.1747 41.2278 35.5627C42.3197 36.2224 42.9465 37.4062 42.9465 38.803C42.9465 40.6269 41.9261 42.0625 40.2072 42.7224L43 46.8552L41.4426 48L37.9335 42.7998V47.8836H36V35H38.6855ZM38.6855 40.918C39.33 40.918 39.5269 40.8985 39.7954 40.7821C40.4757 40.491 40.8875 39.7341 40.8875 38.7835C40.8875 37.6 40.1714 36.9015 38.954 36.9015H37.9514V40.8985H38.6855V40.918Z" fill="#1A1A1A"/>
<path d="M61 40.6995V46.4749C59.6786 47.4852 58.2016 48 56.608 48C52.915 48 50 45.1215 50 41.4618C50 37.8021 52.8764 35 56.5495 35C57.7352 35 58.9981 35.3241 59.9507 35.8578L59.5425 37.8593C58.7069 37.3446 57.3851 36.9824 56.3358 36.9824C54.0618 36.9824 52.2736 39.06 52.2736 41.6142C52.2736 44.1683 54.1394 46.151 56.5495 46.151C57.5211 46.151 58.4928 45.903 58.9596 45.5218V42.5485H55.772L56.1802 40.6995H61Z" fill="#1A1A1A"/>
<path d="M76 41.5001C76 43.2642 75.2175 45.0099 73.8952 46.2542C72.6849 47.4057 71.1391 48 69.3694 48C65.7939 48 63 45.1584 63 41.463C63 39.8657 63.6707 38.2131 64.844 36.95C65.9799 35.7243 67.6749 35 69.4445 35C73.0387 35 76 37.9344 76 41.5001ZM65.1605 41.5001C65.1605 42.9672 65.6448 44.1 66.632 44.9542C67.4327 45.6599 68.476 46.05 69.4815 46.05C71.9398 46.05 73.8208 44.0813 73.8208 41.5371C73.8208 38.9928 71.9211 36.95 69.5002 36.95C67.0789 36.95 65.1605 38.9184 65.1605 41.5001Z" fill="#1A1A1A"/>
<path d="M80.1695 35V46.084H84V48H78V35.0196H80.1695V35Z" fill="#1A1A1A"/>
<path d="M88.7465 35C89.8224 35 90.6202 35.1568 91.4181 35.549C93.5711 36.5882 95 39 95 41.6076C95 44.2157 93.478 46.7056 91.1586 47.5684C90.3235 47.8823 89.5998 48 88.5979 48H86V35.0195H88.7465V35ZM88.4121 46.0391C89.08 46.0391 89.5257 45.9803 89.9896 45.8235C91.7524 45.255 92.9214 43.5294 92.9214 41.5488C92.9214 39.4119 91.5852 37.6077 89.6738 37.098C89.2286 36.9804 88.9136 36.9412 88.2636 36.9412H87.9855L87.9669 46.0391H88.4121Z" fill="#1A1A1A"/>
<path d="M60 0H53V25H60V0Z" fill="#004F3D"/>
<path d="M50 2H43V25H50V2Z" fill="#D3E0DE"/>
<path d="M40 5H33V25H40V5Z" fill="#E8E7E0"/>
<path d="M76 29H19V30H76V29Z" fill="#1A1A1A"/>
</svg>

After

Width:  |  Height:  |  Size: 3.1 KiB

BIN
public/pics1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 101 KiB

30
stores/productStore.ts Normal file
View File

@ -0,0 +1,30 @@
export const useProductStore = defineStore("productStore", () => {
const productList = ref();
async function getList(count: number, categoryId = 1) {
try {
const res = await fetch(
`http://127.0.0.1:4000/api/public/products/category/${categoryId}?p=1&elems=${count}`,
{
headers: {
"Content-Type": "application/json",
},
}
);
if (!res.ok) {
throw new Error(`HTTP error: ${res.status}`);
}
const data = await res.json();
productList.value = data.data.items;
} catch (error) {
console.error("getList error:", error);
}
}
return {
productList,
getList,
};
});