diff --git a/src/index.css b/src/index.css index 1d2d1c2..ad4d8ba 100644 --- a/src/index.css +++ b/src/index.css @@ -43,7 +43,7 @@ body { } -.glassCard { +/*.glassCard { width: 100%; padding: 10px; height: fit-content; @@ -59,8 +59,18 @@ body { inset 0 0 8px 4px rgba(255, 255, 255, 0.4); position: relative; overflow: hidden; -} +}*/ + +/* style a montrer a giovanni prcq il est + bo */ +.glassCard { + background: rgba(255, 255, 255, 0.2); + backdrop-filter: blur(10px); + border-radius: 20px; + padding: 15px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + border: 1px solid rgba(255, 255, 255, 0.3); +} h1 { font-size: 3.2em; line-height: 1.1; diff --git a/src/pages/Stat/StatPage.jsx b/src/pages/Stat/StatPage.jsx index 2003068..9ba9412 100644 --- a/src/pages/Stat/StatPage.jsx +++ b/src/pages/Stat/StatPage.jsx @@ -1,4 +1,3 @@ -import React, { useState } from "react"; import Dropdown from 'react-bootstrap/Dropdown'; import { Doughnut } from "react-chartjs-2"; import { Chart, ArcElement } from "chart.js"; @@ -6,6 +5,8 @@ import styles from "./StatPage.module.css"; import Button from "./../../components/ui/button/button"; import { readUsedSize } from "chart.js/helpers"; import { MenuItem, Select, FormControl, InputLabel } from "@mui/material"; +import React, { useState, useEffect, useRef } from "react"; + Chart.register(ArcElement); @@ -13,7 +14,7 @@ function StatPage() { const [months, setMonths] = useState(3); const [selected, setSelected] = useState("3"); const [participationRate, setParticipationRate] = useState(89); - + const incompleteEvents = [ { title: "Événement A", tasks: "Préparation des flyers" }, { title: "Événement B", tasks: "Réservation de la salle" }, @@ -21,9 +22,7 @@ function StatPage() { { title: "Événement D", tasks: "Communication sur les réseaux" }, { title: "Événement E", tasks: "Communication sur les réseaux" }, { title: "Événement F", tasks: "Communication sur les réseaux" }, - ]; - const pendingMembers = [ { name: "Antoine Ordonneau" }, { name: "Giovanni Josserand" }, @@ -37,11 +36,9 @@ function StatPage() { const handleValidate = (name) => { console.log(`Valider ${name}`); }; - const handleReject = (name) => { console.log(`Refuser ${name}`); }; - const chartData = { labels: ["Progress", "Background"], datasets: [ @@ -50,13 +47,12 @@ function StatPage() { backgroundColor: ["#1e60f9ff", "#ffffffff"], borderWidth: 0, weight: 10, - cutout: "95%", + cutout: "93%", circumference: 360, rotation: -90, }, ], }; - const chartOptions = { responsive: true, plugins: { @@ -72,23 +68,24 @@ function StatPage() { animateRotate: true, }, }; - return (