mns/mns-mini-zabor
mns
/
mns-mini-zabor
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add advantages

This commit is contained in:
Kseninia Mikhaylova 2024-06-11 10:23:22 +03:00
parent 30ceadba00
commit cfdb0b5c11
2 changed files with 23 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
app.vue
View File

@ -25,10 +25,11 @@ const about = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'about')
const reviews = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'clients')
const delivery = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'delivery')
const products = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'products')
const advantages = (pagesData.value as ApiPagesType[]).find(el => el.slug == 'advantages')
const aboutText = computed(() => marked.parse(about?.content || ''))
const deliveryText = computed(() => marked.parse(delivery?.content || ''))
const productsText = computed(() => marked.parse(products?.content || ''))
const deliveryText = computed(() => delivery?.content.split('[col]').map(el => marked.parse(el || '')))
const advantagesText = computed(() => advantages?.content.split('[col]').map(el => marked.parse(el || '')))
const { data: footerData } = await useFetch<ApiFooterType[]>(`${apiBase}/footer/?ordering=small_text`)
const { data: social_networkData } = await useFetch<ApiSocial_networkType[]>(`${apiBase}/social_network/`)
@ -71,7 +72,7 @@ const { scrollToAnchor, scrollToTop } = useAnchorScroll({
<h2 class="siteblock-title">{{ about?.title }}</h2>
<div class="siteblock-text">
<span v-html="aboutText"></span>
</div>
</div>
<div class="siteblock-image">
@ -110,6 +111,16 @@ const { scrollToAnchor, scrollToTop } = useAnchorScroll({
<div class="siteblock bg-white">
<ExpDiagram />
</div>
<div class="siteblock bg-white" :id="advantages?.slug" v-if="advantagesText">
<div class="container">
<div class="prose col-span-12 xl:col-span-6">
<span v-html="advantagesText[0]"></span>
</div>
<div class="prose col-span-12 xl:col-span-6">
<span v-html="advantagesText[1]"></span>
</div>
</div>
</div>
<div class="siteblock siteblock_imgbg bg-slate-500"
:style="[{ backgroundImage: `url(${[apiBase, delivery?.image].join('/')})` }]">
<NuxtImg :src="[apiBase, delivery?.image].join('/')" class="invisible" v-if="delivery" />
@ -118,13 +129,13 @@ const { scrollToAnchor, scrollToTop } = useAnchorScroll({
<CalcValues />
<CalcModels />
</div>
<div class="siteblock bg-white" id="delivery">
<div class="siteblock bg-white" :id="delivery?.slug" v-if="deliveryText">
<div class="container">
<div class="prose col-span-12 xl:col-span-6 whitespace-break-spaces">
<span v-html="deliveryText"></span>
<div class="prose col-span-12 xl:col-span-6">
<span v-html="deliveryText[0]"></span>
</div>
<div class="prose col-span-12 xl:col-span-6 whitespace-break-spaces">
<span v-html="productsText"></span>
<div class="prose col-span-12 xl:col-span-6">
<span v-html="deliveryText[1]"></span>
</div>
</div>
</div>

5
assets/main.scss
View File

@ -9,7 +9,10 @@ body {
}
.container {
@apply max-w-7xl mx-auto grid grid-cols-12 items-center px-4;
@apply max-w-7xl mx-auto px-4 grid grid-cols-12 items-center;
&.min-w-full {
@apply px-0;
}
}
.header {