diff --git a/about.html b/about.html
index b022149..3ad009e 100644
--- a/about.html
+++ b/about.html
@@ -3,15 +3,15 @@
- RocketPy Team - About
+ RocketPy Team - About Us
-
+
@@ -22,10 +22,10 @@
-
+
-
-
-
-
-
-
-
- Redirecting to RocketPy homepage...
-
- The About page is being rebuilt. If you are not redirected, continue to
- rocketpy.org.
-
-
+
+ function getRoleClass(team) {
+ switch (team) {
+ case "general-management":
+ return "role-management";
+ case "library-development":
+ return "role-library";
+ case "web-development":
+ return "role-web";
+ case "public-relations":
+ return "role-pr";
+ default:
+ return "";
+ }
+ }
+
+ function renderTeam(filter = "all") {
+ const grid = document.getElementById("teamGrid");
+ grid.innerHTML = "";
+
+ const filtered =
+ filter === "all"
+ ? teamMembers
+ : teamMembers.filter((m) => m.team === filter);
+
+ filtered.forEach((member) => {
+ const initials = getInitials(member.name);
+ const teamClass = getTeamClass(member.team);
+ const gradClass = getGradClass(member.team);
+ const roleClass = getRoleClass(member.team);
+
+ const card = document.createElement("div");
+ card.className = `member-card ${teamClass}`;
+
+ let socialsHTML = "";
+ if (member.github) {
+ socialsHTML += `
+
+
+ `;
+ }
+ if (member.linkedin) {
+ socialsHTML += `
+
+
+ `;
+ }
+
+ card.innerHTML = `
+
+ ${member.name}
+ ${member.role}
+ ${member.contribution}
+ ${socialsHTML}
+ `;
+
+ grid.appendChild(card);
+ });
+ }
+
+ // Filter tabs event listeners
+ document.querySelectorAll(".filter-btn").forEach((btn) => {
+ btn.addEventListener("click", (e) => {
+ document
+ .querySelectorAll(".filter-btn")
+ .forEach((b) => b.classList.remove("active"));
+ e.target.classList.add("active");
+ renderTeam(e.target.dataset.filter);
+ });
+ });
+
+ // Initial render
+ renderTeam();
+