Use ui Button

src/components/Event/Event.jsx

@@ -31,7 +31,7 @@ function Event({event}){
                 <div className={styles.eventContent}>
                     <div className={`${styles.eventImageDiv}`}>
                         {event.image == null ? (
-                            <img src="empty.png" className={styles.eventImage} alt="Pas de photo de l'événement" />
+                            <img src="/empty.png" className={styles.eventImage} alt="Pas de photo de l'événement" />
                         ) : (
                             <img src={event.image + `.png`} alt="Photo de l'événement" />
                         )}
@@ -39,8 +39,7 @@ function Event({event}){
                     <div className={styles.eventInfos}>
                         <p className={styles.eventTitle}>{event.name}</p>
                         <p>{event.description}</p>
-                        <div className={eventMenu ? styles.eventMenuOpen : styles.eventMenuClose}>
+                            <ul className={eventMenu ? styles.eventMenuOpen : styles.eventMenuClose}>
-                            <ul>
                                 {event.tasks.length > 0 && (
                                     <>
                                         {event.tasks.slice(0, 5).map((task, index) => (
@@ -50,18 +49,18 @@ function Event({event}){
                                         {event.tasks.length > 5 && <li>...</li>}
                                     </>
                                 )}
-
                             </ul>
-                        </div>
                     </div>
                 </div>
                 {windowSize.width > 768 ? (
                     <div className={styles.eventButtons}>
-                        <button
+                        <Button
-                            className={`${styles.moreButton} ${eventMenu ? styles.moreButtonClicked : ""}`}
+                            variant={"transparent"}
-                            onClick={()=>{seteventMenu(!eventMenu)}}>
+                            onClick={()=>{seteventMenu(!eventMenu)}}
+                            className={`${eventMenu ? styles.moreButtonClicked : ""}`}
+                        >
                             {">"}
-                        </button>
+                        </Button>
                     </div>
                 ) : null}
             </div>
@@ -70,7 +69,7 @@ function Event({event}){
                 <Link
                     to={`/event/` + event.id}
                     className={styles.moreLink}>
-                    <Button>En savoir plus →</Button>
+                    <Button>Voir plus</Button>
                 </Link>
             ) : null}
             </div>