diff --git a/mon-projet/src/components/carte.jsx b/mon-projet/src/components/carte.jsx
index adda4ba..0ebb88f 100644
--- a/mon-projet/src/components/carte.jsx
+++ b/mon-projet/src/components/carte.jsx
@@ -2,7 +2,7 @@ import { Link } from "react-router-dom";
 function Carte(props) {
   return (
     <div className="carte">
-      <Link to={`/trilogie/${props.id}`}>Voir les détails</Link>
+      <Link to={`/trilogie/${props.triloId}`}>Voir les détails</Link>
       <h2>{props.titre}</h2>
       <p>{props.niveaux}</p>
       <button onClick={props.onLike}>❤️ {props.likes}</button>
diff --git a/mon-projet/src/pages/Accueil.jsx b/mon-projet/src/pages/Accueil.jsx
index 7e46f2d..5d92064 100644
--- a/mon-projet/src/pages/Accueil.jsx
+++ b/mon-projet/src/pages/Accueil.jsx
@@ -95,6 +95,7 @@ function Accueil() {
       {affichees.map((trilo) => (
         <Carte
           key={trilo.id}
+          triloId={trilo.id}
           titre={trilo.nom}
           niveaux={trilo.niveaux}
           likes={likes[trilo.id] || 0}
diff --git a/mon-projet/src/pages/Details.jsx b/mon-projet/src/pages/Details.jsx
index a5ee210..85258d1 100644
--- a/mon-projet/src/pages/Details.jsx
+++ b/mon-projet/src/pages/Details.jsx
@@ -2,8 +2,8 @@ import { useParams } from "react-router-dom";
 
 function Details() {
   const { id } = useParams(); // récupère le :id de l'URL
-  <p>toto</p>;
-  return <h1>Détails de la trilogie {}</h1>;
-}
+  console.log(id);
 
+  return <h1>Détails de la trilogie {id}</h1>;
+}
 export default Details;