Move evnetPage components

2026-01-19 09:00:53 +01:00
parent d2639f3c87
commit 8eea6075f0
3 changed files with 1 additions and 1 deletions
@@ -1,82 +0,0 @@
-import styles from "./Event.module.css";
-import { useState, useEffect } from "react";
-import { useNavigate } from "react-router";
-import Button from "/src/components/ui/button/button.jsx"
-
-function Event({event}){
-
-    const navigate = useNavigate();
-
-    const [eventMenu, seteventMenu] = useState(false);
-    const [windowSize, setWindowSize] = useState({
-        width: null,
-        height: null,
-    });
-
-    useEffect(() => {
-        function handleResize() {
-            setWindowSize({
-                width: window.innerWidth,
-                height: window.innerHeight,
-            });
-        }
-        window.addEventListener("resize", handleResize);
-        handleResize();
-        return () => window.removeEventListener("resize", handleResize);
-    }, []);
-
-
-    return (
-        <div className={`${styles.eventContainer} glassCard`} onClick={() => seteventMenu(!eventMenu)}>
-            <div className={styles.eventContainerTop}>
-                <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={event.image + `.png`} alt="Photo de l'événement" />
-                        )}
-                    </div>
-                    <div className={styles.eventInfos}>
-                        <p className={styles.eventTitle}>{event.name}</p>
-                        <p>{event.description}</p>
-                        {event.tasks != null ? (
-                            <div className={eventMenu ? styles.eventMenuOpen : styles.eventMenuClose}>
-                                <ul>
-                                    {event.tasks
-                                        .slice(0,5)
-                                        .map((task, index) => (
-                                            <li key={index}> - {task.name}</li>
-                                        ))}
-                                    {event.tasks.length > 5 ? (
-                                        <li>...</li>
-                                    ) : null}
-                                </ul>
-                            </div>
-                        ) : null}
-                    </div>
-                </div>
-                {windowSize.width > 768 ? (
-                    <div className={styles.eventButtons}>
-                        <Button
-                            variant={"transparent"}
-                            onClick={()=>{seteventMenu(!eventMenu)}}
-                            className={`${eventMenu ? styles.moreButtonClicked : ""}`}
-                        >
-                            {">"}
-                        </Button>
-                    </div>
-                ) : null}
-            </div>
-            <div className={styles.eventContainerBottom}>
-            {(windowSize.width <= 768 || eventMenu) ? (
-
-                <Button onClick={() => navigate(`/events/` + event.id)}>Voir plus</Button>
-
-            ) : null}
-            </div>
-        </div>
-    )
-}
-
-export default Event;
@@ -1,127 +0,0 @@
-.eventContainer {
-    display: flex;
-    flex-direction: column;
-    margin: 1rem 0;
-    width: 80%;
-    padding: 1rem 0.5rem;
-}
-
-.eventContainerTop {
-    display: flex;
-    justify-content: space-between;
-}
-
-.eventContainerBottom{
-    display: flex;
-    align-items: center;
-    justify-content: end;
-}
-
-.moreLink {
-    width: fit-content;
-}
-
-.eventImageDiv {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-right: 1rem;
-    width: auto;
-    height: 6rem;
-    flex-shrink: 0;
-}
-
-.eventImage {
-    max-width: 100%;
-    max-height: 100%;
-    object-fit: contain;
-    border-radius: 20px;
-}
-
-
-.eventContent {
-    display: flex;
-    width: 100%;
-}
-
-.eventTitle {
-    font-size: 2rem;
-}
-
-.eventButtons {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: flex-end;
-    width: fit-content;
-    overflow: visible;
-}
-
-.eventButtons a {
-    white-space: nowrap;
-}
-
-.moreButton {
-    background: none;
-    border: none;
-    color: #019AFF;
-    font-size: 1.5rem;
-    transition: all 0.2s ease;
-    cursor: pointer;
-    border-radius: 50%;
-    width: 55px;
-    height: 55px;
-}
-
-.moreButton:hover {
-    font-size: 2rem;
-    background: rgba(191, 191, 191, 0.5);
-}
-
-.moreButton:focus {
-    outline: none;
-}
-.moreButton:focus-visible {
-    outline: 2px solid black;
-}
-
-.moreButtonClicked {
-    rotate: 90deg;
-}
-
-.eventMenuOpen {
-    display: flex;
-    flex-direction: column;
-    margin-left: 1.5em;
-}
-
-.eventMenuClose {
-    display: none;
-}
-
-@media screen and (max-width: 768px) {
-    .eventImage {
-        width: 100%;
-        height: auto;
-        display: block;
-        object-fit: cover;
-        border-bottom-right-radius: 0;
-        border-bottom-left-radius: 0;
-    }
-
-    .eventContainer{
-        padding: 0;
-    }
-
-    .eventImageDiv {
-        margin: 0;
-    }
-
-    .eventContent {
-        flex-direction: column;
-    }
-
-    .eventInfos, .eventContainerBottom {
-        padding: 10px;
-    }
-}