build ui header, footer, home page, about page

app/components/about/AboutTeam.tsx

@@ -0,0 +1,42 @@
+import { AboutData } from '../../about/types';
+
+interface AboutTeamProps {
+    data: AboutData['team'];
+}
+
+const AboutTeam = ({ data }: AboutTeamProps) => {
+    return (
+        <section className="team-section section-padding fix pt-0">
+            <div className="container">
+                <div className="section-title text-center">
+                    <span className="sub-title wow fadeInUp">Our Expert Team</span>
+                    <h2 className="split-text-right split-text-in-right">
+                        {data.title}
+                    </h2>
+                </div>
+                <div className="row g-4">
+                    {data.members.map((member, index) => (
+                        <div key={index} className="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay={`${0.2 * (index + 1)}s`}>
+                            <div className="news-card-item">
+                                <div className="news-image">
+                                    <img src={member.image} alt={member.name} />
+                                </div>
+                                <div className="news-content text-center">
+                                    <h3>{member.name}</h3>
+                                    <span className="text-primary">{member.role}</span>
+                                    <div className="social-icon d-flex justify-content-center gap-2 mt-3">
+                                        {member.social.facebook && <a href={member.social.facebook}><i className="fa-brands fa-facebook-f"></i></a>}
+                                        {member.social.linkedin && <a href={member.social.linkedin}><i className="fa-brands fa-linkedin-in"></i></a>}
+                                        <a href="#"><i className="fa-brands fa-twitter"></i></a>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    ))}
+                </div>
+            </div>
+        </section>
+    );
+};
+
+export default AboutTeam;