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

build ui header, footer, home page, about page

Browse Source
This commit is contained in:
Le Nhut Huy
2026-02-02 16:16:11 +07:00
parent 8d105dda9c
commit d24b9ed33e
38 changed files with 4336 additions and 451 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
app/components/home/VisaCountries.tsx Normal file
View File

@@ -0,0 +1,82 @@
import Link from 'next/link';
interface VisaCountriesProps {
data: {
heading: string;
subheading: string;
description: string;
countries: {
name: string;
code: string;
flag: string;
link: string;
visaTypes: string[];
}[];
ctaButton: {
label: string;
href: string;
};
};
}
const VisaCountries = ({ data }: VisaCountriesProps) => {
// Display the first country as featured
const featuredCountry = data.countries[0];
const halfLength = Math.ceil(featuredCountry.visaTypes.length / 2);
const firstColumn = featuredCountry.visaTypes.slice(0, halfLength);
const secondColumn = featuredCountry.visaTypes.slice(halfLength);
return (
<section className="feature-section section-padding fix bg-cover" style={{ backgroundImage: "url('/assets/img/home-1/feature/bg.png')" }}>
<div className="container">
<div className="feature-wrapper">
<div className="row g-4">
<div className="col-lg-6">
<div className="feature-content">
<div className="section-title mb-0">
<span className="sub-title bg-2 wow fadeInUp">{data.subheading}</span>
<h2 className="text-white 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="feature-list-item wow fadeInUp" data-wow-delay=".5s">
<ul className="list">
{firstColumn.map((visaType, index) => (
<li key={index}>
<i className="fa-solid fa-arrow-right"></i>
{visaType}
</li>
))}
</ul>
<ul className="list">
{secondColumn.map((visaType, index) => (
<li key={index}>
<i className="fa-solid fa-arrow-right"></i>
{visaType}
</li>
))}
</ul>
</div>
<Link href={data.ctaButton.href} className="theme-btn">
{data.ctaButton.label}
<i className="fa-solid fa-arrow-right"></i>
</Link>
</div>
</div>
<div className="col-lg-6">
<div className="feature-image">
<img src={featuredCountry.flag} alt="img" />
<h6>{featuredCountry.code}.{featuredCountry.name}</h6>
</div>
</div>
</div>
</div>
</div>
</section>
);
};
export default VisaCountries;