40 lines
1.5 KiB
Vue
40 lines
1.5 KiB
Vue
import UiParagraph from '@/components/Typography/UiParagraph.vue';
|
||
<template>
|
||
<div
|
||
v-for="({ topContent, button, botContent, path }, index) in content.data"
|
||
:key="index"
|
||
class="flex flex-col items-center max-w-96"
|
||
>
|
||
<UiParagraph size="300" class="mb-12 h-32">{{ topContent }} </UiParagraph>
|
||
<UiButton tag="RouterLink" :to="path" variants="primary" class="mb-3 w-full"
|
||
>{{ button }}
|
||
</UiButton>
|
||
<UiParagraph as="span" size="200"> {{ botContent }}</UiParagraph>
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import UiParagraph from '@/components/Typography/UiParagraph.vue'
|
||
import UiButton from '@/components/UiButton/UiButton.vue'
|
||
import { reactive } from 'vue'
|
||
|
||
const content = reactive({
|
||
data: [
|
||
{
|
||
topContent:
|
||
'💡 Узнай, как думает мужчина, что его действительно цепляет, и что делает женщину незабываемой.',
|
||
button: 'КУПИТЬ КНИГУ I',
|
||
botContent: 'PDF + EPUB сразу после оплаты',
|
||
path: '/books/1',
|
||
},
|
||
{
|
||
topContent:
|
||
'💡 Продолжение для тех, кто готов перейти от флирта к глубокому контакту. Как строить притяжение, не теряя себя.',
|
||
button: 'КУПИТЬ КНИГУ II',
|
||
botContent: 'PDF + EPUB сразу после оплаты',
|
||
path: '/books/2',
|
||
},
|
||
],
|
||
})
|
||
</script>
|