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

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

5
assets/main.scss
View File

@ -9,7 +9,10 @@ body {
} }
.container { .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 { .header {