minhnhat/uldp.edu.vn
1
0
Fork 0
forked from UKSOURCE/hailearning.edu.vn
Code Pull Requests 1 Activity

feat: Refactor home page components

Browse Source
This commit is contained in:
Wini_Fy
2026-02-05 21:20:12 +07:00
parent 2a475901cc
commit 03263d5fb1
6 changed files with 149 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
app/components/home/WhyChooseUs.tsx
View File

@@ -3,8 +3,11 @@ import Link from 'next/link';
interface WhyChooseUsProps {
data: {
heading: string;
highlightWord?: string;
subheading: string;
description: string;
mainImage?: string;
secondaryImage?: string;
items: {
icon: string;
title: string;
@@ -19,6 +22,25 @@ interface WhyChooseUsProps {
}
const WhyChooseUs = ({ data }: WhyChooseUsProps) => {
const highlight = data.highlightWord?.trim();
let headingContent: React.ReactNode = data.heading;
if (highlight) {
const index = data.heading.indexOf(highlight);
if (index !== -1) {
const before = data.heading.slice(0, index);
const after = data.heading.slice(index + highlight.length);
headingContent = (
<>
{before}
<span>{highlight}</span>
{after}
</>
);
}
}
return (
<section className="about-section section-padding fix pb-0">
<div className="top-shape">
@@ -29,9 +51,9 @@ const WhyChooseUs = ({ data }: WhyChooseUsProps) => {
<div className="row g-4">
<div className="col-lg-6">
<div className="about-image">
<img src="/assets/img/home-1/about/about-1.jpg" alt="img" className="wow img-custom-anim-left" />
<img src={data.mainImage || "/assets/img/home-1/about/about-1.jpg"} alt="img" className="wow img-custom-anim-left" />
<div className="about-image-2">
<img src="/assets/img/home-1/about/about-02.jpg" alt="img" className="wow img-custom-anim-right" />
<img src={data.secondaryImage || "/assets/img/home-1/about/about-02.jpg"} alt="img" className="wow img-custom-anim-right" />
</div>
<div className="bg-shape">
<img src="/assets/img/home-1/about/Vector.png" alt="img" />
@@ -49,7 +71,7 @@ const WhyChooseUs = ({ data }: WhyChooseUsProps) => {
<div className="section-title mb-0">
<span className="sub-title wow fadeInUp">{data.subheading}</span>
<h2 className="split-text-right split-text-in-right">
{data.heading.split(' Dreams ')[0]} <span>Dreams</span> {data.heading.split(' Dreams ')[1]}
{headingContent}
</h2>
</div>
<p className="text wow fadeInUp" data-wow-delay=".3s">