From 6f7e5b9258e286050918bf5a0cb73812e0e3f0b5 Mon Sep 17 00:00:00 2001
From: T'JAMPENS QUENTIN p2406187 <pyramond69@gmail.com>
Date: Sun, 7 Dec 2025 15:38:37 +0100
Subject: [PATCH] use UI Button

---
 src/pages/Volunteers/VolunteerCard.jsx         | 10 +++++-----
 src/pages/Volunteers/VolunteersPage.module.css |  4 ++++
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/src/pages/Volunteers/VolunteerCard.jsx b/src/pages/Volunteers/VolunteerCard.jsx
index 0f5437c..a2a3f84 100644
--- a/src/pages/Volunteers/VolunteerCard.jsx
+++ b/src/pages/Volunteers/VolunteerCard.jsx
@@ -26,15 +26,15 @@ export default function VolunteerCard({ id }) {
     return (
         <div className={`${styles.profileboard} glassCard`}>
 
-            {/* Header : titre + bouton expand */}
             <div className={styles.header}>
                 <h2>{user?.name}</h2>
-                <button
-                    className={`${styles.expandButton} glassCard`}
+                 <Button
+                    variant={"transparent"}
                     onClick={toggleExpand}
+                    className={`${isExpanded ? styles.moreButtonClicked : ""}`}
                 >
-                    {isExpanded ? "▼" : "▲"}
-                </button>
+                    {">"}
+                </Button>
             </div>
 
             <div className={styles.mainContent}>
diff --git a/src/pages/Volunteers/VolunteersPage.module.css b/src/pages/Volunteers/VolunteersPage.module.css
index bf48824..c18433e 100644
--- a/src/pages/Volunteers/VolunteersPage.module.css
+++ b/src/pages/Volunteers/VolunteersPage.module.css
@@ -88,6 +88,10 @@
     font-size: 16px;
 }
 
+.moreButtonClicked {
+    rotate: 90deg;
+}
+
 @media screen and (min-width: 768px) {
     .profilePictureContainer {
         width: 150px;