feat: add Contact and Accreditation pages

This commit is contained in:
hkiett265
2026-04-14 16:00:11 +07:00
parent 4bfad8481b
commit 10103806bb
18 changed files with 692 additions and 0 deletions

View File

@@ -0,0 +1,27 @@
type DepartmentCardProps = {
icon: string;
title: string;
description: string;
email: string;
phone: string;
};
export default function DepartmentCard({ icon, title, description, email, phone }: DepartmentCardProps) {
return (
<div className="bg-white rounded-[16px] p-8 shadow-[0_8px_30px_rgb(0,0,0,0.04)] border border-gray-100 hover:shadow-[0_8px_30px_rgb(38,60,111,0.08)] transition-all duration-300 flex flex-col h-full group">
<div className="w-14 h-14 bg-blue-50 rounded-[12px] flex items-center justify-center text-primary text-2xl mb-6 group-hover:bg-primary group-hover:text-white transition-colors">
<i className={icon}></i>
</div>
<div className="contact-card-title font-display font-bold text-dark mb-3">{title}</div>
<p className="text-sm text-gray-600 mb-6 flex-grow">{description}</p>
<div className="pt-4 border-t border-gray-100 mt-auto">
<a href={`mailto:${email}`} className="flex items-center gap-3 text-sm text-gray-700 hover:text-primary mb-3 transition-colors">
<i className="far fa-envelope text-primary w-4"></i> {email}
</a>
<a href={`tel:${phone.replace(/\s/g, '')}`} className="flex items-center gap-3 text-sm text-gray-700 hover:text-primary transition-colors">
<i className="fas fa-phone text-primary w-4"></i> {phone}
</a>
</div>
</div>
);
}