diff --git a/front_end/src/classes.tsx b/front_end/src/classes.tsx
index a22ad88..a7aa095 100644
--- a/front_end/src/classes.tsx
+++ b/front_end/src/classes.tsx
@@ -106,6 +106,7 @@ export function getUserTest():User{
     s1.name = "Entrainement Frisbee"
     s1.isRecurrent = true;
     s1.ligne = [ligne1];
+    s1.duree= 90;
     var date2 = new Date();
     date2.setDate(date2.getDate() + 2);
     s2.creneau = date2;
@@ -113,11 +114,13 @@ export function getUserTest():User{
     s2.isRecurrent = false;
     s2.name = "entraintement 2"
     s2.ligne = [ligne2];
+    s2.duree= 120;
     s3.creneau = date2;
     s3.id = 3;
     s3.isRecurrent = false;
     s3.name  = "entraintement 3"
-    s3.ligne = [ligne3];
+    s3.ligne = [ligne3, ligne1];
+    s3.duree= 120;
 
     
 
diff --git a/front_end/src/components/ressourceList.tsx b/front_end/src/components/ressourceList.tsx
index b21912a..0eca026 100644
--- a/front_end/src/components/ressourceList.tsx
+++ b/front_end/src/components/ressourceList.tsx
@@ -1,10 +1,12 @@
 import { Athlete, Activite, Coach, Session, Ligne } from "../classes";
+import {calculTempsDeJeuParLigne} from "../utils/ligneUtils";
+
 
 type AthleteListProps = { athletes: Athlete[] };
 type ActiviteListProps = { activites: Activite[] };
 type CoachListProps = { coachs: Coach[] };
 type SessionListProps = { sessions: Session[]};
-type LigneListProps = { lignes: Ligne[]};
+type LigneListProps = { lignes: Ligne[], tempsDeJeuParLigne: Map<number, number> };
 
 function AthleteList({ athletes }: AthleteListProps) {
     return (
@@ -81,7 +83,7 @@ function SessionList({ sessions }: SessionListProps) {
     );
 }
 
-function LigneList({ lignes }: LigneListProps) {
+function LigneList({ lignes, tempsDeJeuParLigne }: LigneListProps) {
     return (
         <ul className="LigneList">
             {lignes.map((lignes) => (
@@ -102,7 +104,8 @@ function LigneList({ lignes }: LigneListProps) {
                     </div>
                     </div>
                     <div>
-                        <strong>Temps de jeu: {lignes.tempsDeJeu}</strong>
+                        <strong>Temps de jeu total :</strong>{" "}
+                        {tempsDeJeuParLigne.get(lignes.id) ?? 0} min
                     </div>
                 </li>
             ))}
diff --git a/front_end/src/components/ressourcePanel.tsx b/front_end/src/components/ressourcePanel.tsx
index 57f8661..63b1ab7 100644
--- a/front_end/src/components/ressourcePanel.tsx
+++ b/front_end/src/components/ressourcePanel.tsx
@@ -1,16 +1,19 @@
-	import { useState } from "react";
-	import { useLocalData } from "../context/useLocalData";
-	import { AthleteList, ActiviteList, CoachList, SessionList, LigneList} from "./ressourceList";
-	import { Activite, Athlete, Coach , Session, Ligne } from "../classes";
+import { useState } from "react";
+import { useLocalData } from "../context/useLocalData";
+import { AthleteList, ActiviteList, CoachList, SessionList, LigneList} from "./ressourceList";
+import { Activite, Athlete, Coach , Session, Ligne } from "../classes";
+import {calculTempsDeJeuParLigne} from "../utils/ligneUtils";
+import { keyboard } from "@testing-library/user-event/dist/keyboard";
+import { unescapeLeadingUnderscores } from "typescript";
+
+
+	export type keyWord = "athletes" | "activites" | "coachs" | "sessions"| "lignes";
 
 	export default function RessourcePanel() {
 	    const { user } = useLocalData();
-	    const [showAthletes, setShowAthletes] = useState(false);
-	    const [showActivites, setShowActivites] = useState(false);
-	    const [showCoachs,setShowCoachs] = useState(false);
-	    const [showSessions, setShowSessions] = useState(false);
-	    const [showLignes, setShowLignes] = useState(false);
+		const [value,setValue] = useState<keyWord>("athletes");
 	    console.log("Rôle utilisateur:", user.role);
+		console.log("name", user.nom);
 	    if (user.role === "Athlete") return null;
 
 
@@ -52,50 +55,17 @@
 		}
 	    });
 
-	    const allLignes: Ligne[] = Array.from(ligneMap.values());
+	    
+		const allLignes: Ligne[] = Array.from(ligneMap.values());
 
-	    function onAthletesClick(): void {
-		setShowAthletes(prev => !prev);
-		setShowActivites(false); 
-		setShowCoachs(false);
-		setShowSessions(false);
-		setShowLignes(false);
+		// Calculer le temps de jeu pour chaque ligne
+		const tempsDeJeuParLigne: Map<number, number> = new Map();
+		allLignes.forEach(ligne => {
+			const tempsTotal = calculTempsDeJeuParLigne(allSessions, ligne);
+			tempsDeJeuParLigne.set(ligne.id, tempsTotal);
+			ligne.tempsDeJeu = tempsTotal;
+		});
 
-	    }
-	    function onActivitiesClick(): void {
-		setShowActivites(prev => !prev);
-		setShowAthletes(false);
-		setShowCoachs(false);
-		setShowSessions(false);
-		setShowLignes(false);
-
-
-	    }
-	    function onCoachClick(): void {
-		setShowCoachs(prev => !prev);
-		setShowActivites(false); 
-		setShowAthletes(false);
-		setShowSessions(false);
-		setShowLignes(false);
-
-	    }
-
-	    function onSessionClick(): void {
-		setShowSessions(prev => !prev);
-		setShowActivites(false); 
-		setShowAthletes(false);
-		setShowCoachs(false);
-		setShowLignes(false);
-
-	    }
-
-	    function onLigneClick():void{
-		setShowLignes(prev => !prev);
-		setShowAthletes(false);
-		setShowActivites(false); 
-		setShowCoachs(false);
-		setShowSessions(false);
-	    }
 
 
 	    return (
@@ -106,53 +76,48 @@
 		    <select
 		        onChange={(e) => {
 		            const v = (e.target as HTMLSelectElement).value;
-		            if (v === "athletes") onAthletesClick();
-		            else if (v === "activites") onActivitiesClick();
-		            else if (v === "coach") onCoachClick();
-		            else if (v === "session") onSessionClick();
-		            else if (v === "lignes") onLigneClick();
-		            else {setShowAthletes(false); setShowActivites(false); setShowCoachs(false); setShowSessions(false)}
+					setValue(v as keyWord)
 		        }}>
 		        <option value="athletes">Athlètes</option>
 		        <option value="activites">Activités</option>
-		        {user.role === "Admin" && <option value="coach"> Coach</option>}
-		        <option value="session"> Session</option>
+		        {user.role === "Admin" && <option value="coachs"> Coachs</option>}
+		        <option value="sessions"> Sessions</option>
 		        <option value="lignes"> Lignes</option>
 
 		    </select>
 
-		    {showAthletes && (
+		    {value==="athletes" && (
 		        <div className="edt_athletes_panel">
 		            <h3>Liste des athlètes</h3>
 		            <AthleteList athletes={allAthletes} />
 		        </div>
 		    )}
 
-		    {showActivites && (
+		    {value==="activites" && (
 		        <div className="edt_activites_panel">
 		            <h3>Liste des activités</h3>
 		            <ActiviteList activites={allActivites} />
 		        </div>
 		    )}
 
-		    {showCoachs && (
+		    {value==="coachs" && (
 		        <div className="edt_coachs_panel">
 		            <h3>Liste des coachs</h3>
 		            <CoachList coachs={allCoachs} />
 		        </div>
 		    )}
 
-		    {showSessions && (
+		    {value==="sessions" && (
 		        <div className="edt_sessions_panel">
 		            <h3>Liste des sessions</h3>
 		            <SessionList sessions={allSessions} />
 		        </div>
 		    )}
 
-		    {showLignes && (
+		    {value==="lignes" && (
 		        <div className="edt_lignes_panel">
 		            <h3>Liste des lignes</h3>
-		            <LigneList lignes={allLignes} />
+		            <LigneList lignes={allLignes} tempsDeJeuParLigne={tempsDeJeuParLigne}/>
 		        </div>
 		    )}
 
diff --git a/front_end/src/index.css b/front_end/src/index.css
index 414bda6..a52953a 100644
--- a/front_end/src/index.css
+++ b/front_end/src/index.css
@@ -68,7 +68,17 @@ code {
 
 input{
   background-color: var(--tint2);
-  color: var(--test);
+  color: var(--text);
   border-color: var(--tint5);
   border-radius: 8px;
+}
+
+button{
+  color: var(--text); 
+  background-color: var(--tint3);
+}
+
+select{
+  color: var(--text); 
+  background-color: var(--tint3);
 }
\ No newline at end of file
diff --git a/front_end/src/utils/ligneUtils.tsx b/front_end/src/utils/ligneUtils.tsx
new file mode 100644
index 0000000..629c5b4
--- /dev/null
+++ b/front_end/src/utils/ligneUtils.tsx
@@ -0,0 +1,16 @@
+import {Ligne, Session} from '../classes';
+
+//Temps de jeu cumulé par ligne
+ 
+export function calculTempsDeJeuParLigne(sessions: Session[], ligne : Ligne): number {
+    let tempsDeJeuTotal = 0;
+
+    sessions.forEach(session => {
+        // Vérifier si la ligne est présente dans la session
+        if (session.ligne && session.ligne.some(l => l.id === ligne.id)) {
+            tempsDeJeuTotal += session.duree;
+        }
+    });
+
+    return tempsDeJeuTotal;
+}
\ No newline at end of file