ud

src/components/layout/SwiperCardSection/index.tsx

@@ -20,7 +20,7 @@ type Data = {
     }[];
 }
 
-export default function SwiperCardSection({ data }: { data: Data }) {
+export default function SwiperCardSection({ data, disableHover=false  }: { data: Data, disableHover?: boolean }) {
     const location = useLocation();
     const hash = location.hash;
     const hashId = decodeURIComponent(hash.replace('#', ''));
@@ -63,7 +63,7 @@ export default function SwiperCardSection({ data }: { data: Data }) {
                     {data.cardItems.map((item, index) => (
                         <SwiperSlide key={item.title}>
                             <ScrollReveal preset="slideUp" amount={0.2} delay={index > 2 ? 0 : index * 0.5}>
-                                <div className={styles.swiperCardItem}>
+                                <div className={styles.swiperCardItem} style={{ pointerEvents: disableHover ? 'none' : 'auto' }}>
                                     <img src={item.backgroundImage ?? item.image ?? ""} alt={item.title} />
                                     <div className={styles.swiperMask}></div>
                                     <div className={styles.swiperContent}>

src/pages/About/Founder.module.css

@@ -172,6 +172,13 @@
   gap: 1rem;
   width: 70%;
   margin: 0 auto;
+  margin-top: -50px;
+}
+
+.section3Col {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
 }
 
 .section3Item {

src/pages/About/Founder.tsx

@@ -17,8 +17,16 @@ export default function AboutFounder() {
     const section2Data = founder?.section2Data;
     const section3Data = founder?.section3Data;
     const section4Data = founder?.section4Data;
-
+    const items = (section3Data.items || []).reduce((p: any, c: any) => {
-    if (!founder) return null;
+        const col = Number(c.column) - 1
+        if (p[col]) {
+            p[col].push(c)
+        } else {
+            p[col] = []
+            p[col].push(c)
+        }
+        return p
+    }, [])
 
     return (
         <div>
@@ -81,8 +89,11 @@ export default function AboutFounder() {
                 <Section title={section3Data?.title} titleColor="#fff" background={section3Data?.backgroundImage}>
                     <div className={styles.section3Content}>
                         {
-                            section3Data?.items.map((item: { title?: string }, index: number) => (
+                            items.map((col: any, index: number) => (
-                                <ScrollReveal preset="slideUp" amount={0.2} delay={index * 0.5} key={item.title}>
+                                <div className={styles.section3Col} key={index}>
+                                    {
+                                        col.map((item: any, colIndex: number) => (
+                                            <ScrollReveal preset="slideUp" amount={0.2} delay={colIndex * 0.5} key={item.title}>
                                                 <div key={index} className={styles.section3Item}>
                                                     {item.title ? <li>{item.title}</li> : null}
                                                 </div>
@@ -90,6 +101,9 @@ export default function AboutFounder() {
                                         ))
                                     }
                                 </div>
+                            ))
+                        }
+                    </div>
                 </Section>
             )}
             <TimeLineComponent section4Data={section4Data} />

src/pages/PropertyService/index.tsx

@@ -39,7 +39,7 @@ export default function PropertyService() {
             />
 
             {section1Data && <ParagraphSection data={section1Data} />}
-            {swiperCardData && <SwiperCardSection data={swiperCardData} />}
+            {swiperCardData && <SwiperCardSection data={swiperCardData} disableHover />}
             {rowAccordionData && <RowAccordion data={rowAccordionData} />}
             {section4Data && <HonorGrids data={section4Data} />}
         </div>