forked from UKSOURCE/hailearning.edu.vn
refactor ui and json data about
This commit is contained in:
@@ -1,57 +1,70 @@
|
||||
import Link from 'next/link';
|
||||
import { AboutData } from '../../about/types';
|
||||
import Link from "next/link";
|
||||
import { AboutData } from "../../about/types";
|
||||
|
||||
interface AboutMissionProps {
|
||||
data: AboutData['mission'];
|
||||
data: AboutData["mission"];
|
||||
}
|
||||
|
||||
const AboutMission = ({ data }: AboutMissionProps) => {
|
||||
return (
|
||||
<section className="about-section section-padding fix pb-0">
|
||||
<div className="top-shape">
|
||||
<img src="/assets/img/home-1/about/globe.png" alt="img" />
|
||||
<img src={data.images.globeShape} alt="img" />
|
||||
</div>
|
||||
<div className="container">
|
||||
<div className="about-wrapper">
|
||||
<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.images.main} 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.images.secondary} alt="img" className="wow img-custom-anim-right" />
|
||||
</div>
|
||||
<div className="bg-shape">
|
||||
<img src="/assets/img/home-1/about/Vector.png" alt="img" />
|
||||
<img src={data.images.bgShape} alt="img" />
|
||||
</div>
|
||||
<div className="plane-shape float-bob-y">
|
||||
<img src="/assets/img/home-1/about/plane.png" alt="img" />
|
||||
<img src={data.images.planeShape} alt="img" />
|
||||
</div>
|
||||
<div className="top-shape float-bob-y">
|
||||
<img src="/assets/img/home-1/about/shape.png" alt="img" />
|
||||
<img src={data.images.topShape} alt="img" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="about-content">
|
||||
<div className="section-title mb-0">
|
||||
<span className="sub-title wow fadeInUp">About Our Consultancy</span>
|
||||
<h2 className="split-text-right split-text-in-right">
|
||||
{data.title}
|
||||
</h2>
|
||||
<span className="sub-title wow fadeInUp">{data.subheading}</span>
|
||||
<h2 className="split-text-right split-text-in-right">{data.heading}</h2>
|
||||
</div>
|
||||
<p className="text wow fadeInUp" data-wow-delay=".3s">
|
||||
{data.description}
|
||||
</p>
|
||||
<div className="about-item wow fadeInUp" data-wow-delay=".5s">
|
||||
{data.items.map((item, index) => (
|
||||
<div key={index} className="content mb-3">
|
||||
<div key={index} className="content">
|
||||
<span>
|
||||
<img src="/assets/img/home-1/icon/01.svg" alt="" className="me-2" />
|
||||
<strong>{item.label}</strong>
|
||||
<img src={item.icon} alt="" className="me-2 d-inline-block" />
|
||||
{item.label}-
|
||||
</span>
|
||||
<p>{item.description}</p>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<Link href="/contact" className="theme-btn wow fadeInUp" data-wow-delay=".5s">
|
||||
Get Started
|
||||
<ul className="list wow fadeInUp" data-wow-delay=".3s">
|
||||
{data.features.map((feature, index) => (
|
||||
<li key={index}>
|
||||
<i className="fa-solid fa-chevrons-right"></i>
|
||||
{feature}
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
<Link
|
||||
href={data.ctaButton.href}
|
||||
className="theme-btn wow fadeInUp"
|
||||
data-wow-delay=".5s"
|
||||
>
|
||||
{data.ctaButton.label}
|
||||
<i className="fa-solid fa-arrow-right"></i>
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user