remove folder pages
This commit is contained in:
99
components/section/InvestmentSave.vue
Normal file
99
components/section/InvestmentSave.vue
Normal file
@ -0,0 +1,99 @@
|
||||
<template>
|
||||
<UiContainer class="space-y-[50px] sm:space-y-[30px] xl:space-y-[100px]">
|
||||
<div class="space-25-55">
|
||||
<div class="space-25-75">
|
||||
<h4 class="h4-uppercase-bold-inter">
|
||||
{{ component.section_lang_data.main_title }}
|
||||
</h4>
|
||||
<div
|
||||
class="w-full h-full flex flex-col items-stretch gap-4 xl:flex-row space-25-55 xl:!space-y-0"
|
||||
>
|
||||
<div
|
||||
class="flex flex-col space-y-[55px] xl:space-y-0 xl:justify-between"
|
||||
>
|
||||
<p>{{ component.section_lang_data.main_description }}</p>
|
||||
<p>{{ component.section_lang_data.section_title }}</p>
|
||||
<ul>
|
||||
<li
|
||||
class=""
|
||||
v-for="(item, index) in component.section_lang_data
|
||||
.section_items"
|
||||
:key="index"
|
||||
>
|
||||
<span>{{ index + 1 }}. </span>{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div
|
||||
class="w-full xl:max-w-[690px] h-[200px] sm:h-[390px] block rounded-2xl"
|
||||
:style="{
|
||||
backgroundImage: `url('/api/files/${component.image_collection}/${component.section_id}/${component.section_img[0]}?thumb=640x0')`,
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center',
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex items-center justify-center">
|
||||
<div
|
||||
class="flex flex-col items-center p-3 sm:p-6 md:p-8 xl:p-11 border border-block rounded-2xl gap-5"
|
||||
>
|
||||
<h4
|
||||
class="h4-uppercase-bold-inter text-accent-green-light dark:text-accent-green-dark"
|
||||
>
|
||||
20 {{ $t("years") }}
|
||||
</h4>
|
||||
<img
|
||||
class="dark:hidden"
|
||||
:src="`/api/files/${component.image_collection}/${component.section_id}/${component.section_img[2]}?thumb=640x0')`"
|
||||
alt=""
|
||||
/>
|
||||
<img
|
||||
class="hidden dark:block"
|
||||
:src="`/api/files/${component.image_collection}/${component.section_id}/${component.section_img[3]}?thumb=640x0')`"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-4 xl:flex-row space-25-55">
|
||||
<div class="flex flex-col space-25-55 xl:justify-between">
|
||||
<p>{{ component.section_lang_data.info_description }}</p>
|
||||
<h4 class="h4-uppercase-bold-inter">
|
||||
{{ component.section_lang_data.info_title }}
|
||||
</h4>
|
||||
<div
|
||||
v-html="component.section_lang_data.info_description_second"
|
||||
class=""
|
||||
></div>
|
||||
</div>
|
||||
<div
|
||||
class="w-full xl:max-w-[690px] h-[170px] sm:h-[360px] block rounded-2xl"
|
||||
:style="{
|
||||
backgroundImage: `url('/api/files/${component.image_collection}/${component.section_id}/${component.section_img[1]}?thumb=640x0')`,
|
||||
backgroundSize: 'cover',
|
||||
backgroundPosition: 'center',
|
||||
}"
|
||||
/>
|
||||
</div>
|
||||
</UiContainer>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const props = defineProps<{ component: Component }>();
|
||||
type Component = {
|
||||
image_collection: string;
|
||||
section_id: string;
|
||||
section_img: string;
|
||||
section_lang_data: {
|
||||
main_title: string;
|
||||
main_description: string;
|
||||
section_title: string;
|
||||
section_items: [];
|
||||
|
||||
info_description: string;
|
||||
info_title: string;
|
||||
info_description_second: string;
|
||||
};
|
||||
};
|
||||
</script>
|
Reference in New Issue
Block a user