From cfdb0b5c11f6d46add9ddc7697b6e451b63f4bf3 Mon Sep 17 00:00:00 2001
From: Kseninia Mikhaylova <k.mikhailova@svs-tech.pro>
Date: Tue, 11 Jun 2024 10:23:22 +0300
Subject: [PATCH] add advantages

---
 app.vue          | 27 +++++++++++++++++++--------
 assets/main.scss |  5 ++++-
 2 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/app.vue b/app.vue
index 43e7543..294e17e 100644
--- a/app.vue
+++ b/app.vue
@@ -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>
diff --git a/assets/main.scss b/assets/main.scss
index 4b23634..c1216e5 100644
--- a/assets/main.scss
+++ b/assets/main.scss
@@ -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 {