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

refactor json header, footer, home and styling ui

Browse Source
This commit is contained in:
Le Nhut Huy
2026-02-03 12:09:24 +07:00
parent 1add9d4d9d
commit 5b29928f16
11 changed files with 1476 additions and 502 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
app/components/layout/Header/HeaderTop.tsx
View File

@@ -1,29 +1,32 @@
import Link from 'next/link';
import headerData from './header.json';
const HeaderTop = () => {
const { phone, email, location, socialLinks, languages } = headerData.top;
return (
<div className="header-top-section">
<div className="container-fluid">
<div className="header-top-wrapper">
<div className="header-left">
<ul className="list d-flex align-items-center mb-0 p-0 list-unstyled">
<li className="style-2 d-flex align-items-center me-4">
<span className="me-2">Help Line</span>
<i className="fa-solid fa-phone me-2"></i>
<a href="tel:+84961834040">+84 961 83 4040</a>
</li>
<ul className="list d-flex align-items-center mb-0 p-0 list-unstyled">
<li className="style-2 d-flex align-items-center me-4">
<span className="me-2">Help Line</span>
<i className="fa-solid fa-phone me-2"></i>
<a href={`tel:${phone.replace(/\s/g, '')}`}>{phone}</a>
</li>
<li className="d-flex align-items-center me-4">
<i className="fa-solid fa-location-dot me-2"></i>
734 Luy Ban Bich St, Tan Thanh Ward, Tan Phu Dist, HCMC
</li>
<li className="d-flex align-items-center me-4">
<i className="fa-solid fa-location-dot me-2"></i>
{location}
</li>
<li className="d-flex align-items-center">
<i className="fa-solid fa-envelope me-2"></i>
<a href="mailto:get-info@hai.edu.vn">get-info@hai.edu.vn</a>
</li>
</ul>
</div>
<li className="d-flex align-items-center">
<i className="fa-solid fa-envelope me-2"></i>
<a href={`mailto:${email}`}>{email}</a>
</li>
</ul>
</div>
<div className="header-right">
<div className="flag-wrap">
@@ -32,26 +35,27 @@ const HeaderTop = () => {
</div>
<div className="nice-select" tabIndex={0}>
<span className="current">
English
{languages[0]?.name || 'English'}
</span>
<ul className="list">
<li data-value="1" className="option selected focus">
English
</li>
<li data-value="1" className="option">
Bangla
</li>
<li data-value="1" className="option">
Hindi
</li>
{languages.map((lang, index) => (
<li
key={index}
data-value={lang.value}
className={`option ${index === 0 ? 'selected focus' : ''}`}
>
{lang.name}
</li>
))}
</ul>
</div>
</div>
<div className="social-item">
<a href="#"><i className="fa-brands fa-linkedin"></i></a>
<a href="#"><i className="fa-brands fa-twitter"></i></a>
<a href="#"><i className="fa-brands fa-instagram"></i></a>
<a href="#"><i className="fa-brands fa-youtube"></i></a>
{socialLinks.map((social, index) => (
<a key={index} href={social.url} target="_blank" rel="noopener noreferrer">
<i className={social.icon}></i>
</a>
))}
</div>
</div>
</div>