From ce003368626f237a4668fea56f44d0463199ff82 Mon Sep 17 00:00:00 2001
From: HarmandI <isabelle44.74@gmail.com>
Date: Tue, 19 Oct 2021 17:17:14 +0200
Subject: [PATCH] Affichage avec url

---
 .parcel-cache/lock.mdb | Bin 8192 -> 8192 bytes
 characters.html        |   5 ++++-
 scripts/personnages.js |   9 +++++++--
 styles/style.css       |  10 ++++++++++
 4 files changed, 21 insertions(+), 3 deletions(-)

diff --git a/.parcel-cache/lock.mdb b/.parcel-cache/lock.mdb
index 1fc256ed07fddf7fee25a1904c6615c55029f746..18eee23292fb714d3b1c729b781efdfc9981c1ad 100644
GIT binary patch
delta 61
zcmZp0XmC)tci{a#rUqdSJ4OaDV1iH#H?lIt)h>P5HBmu>ZHhSq1CPW+KPxcni|NL`
GB6$D=VG!Q{

delta 61
zcmZp0XmC)tci{a#rUqe-qYMzh45fem{cXhYeh1e?1r4?p77Ppv<R|)Bfmv^~H})0D
F0{}c^5|ID^

diff --git a/characters.html b/characters.html
index 0b41100..e277f14 100644
--- a/characters.html
+++ b/characters.html
@@ -16,11 +16,14 @@
                 <li id="films"><a href="films.html">Films</a></li>
                 <li id="planets"><a href="planets.html">Planets</a></li>
                 <li id="characters"><a href="characters.html">Characters</a></li>
+                
             </ul>
         </nav>
+        
     </section>
+    <div class="image-charactere" ></div>
     <section id="resultats"></section>
    
-    
+   
 </body>
 </html>
\ No newline at end of file
diff --git a/scripts/personnages.js b/scripts/personnages.js
index d135ed1..db4933a 100644
--- a/scripts/personnages.js
+++ b/scripts/personnages.js
@@ -2,6 +2,7 @@ import { api_call,API_URL } from "./util";
 
 const PERSONNAGES = document.getElementById("resultats");
 const NAME = document.getElementById("titreaccordeon");
+const PLANETENAISSANCE= document.getElementById("2");
 
 class People {
   constructor(birth_year, eye_colo, gender, hair_color,height,mass,skin_color) {
@@ -58,9 +59,13 @@ for (let i = 0; i < PERPAGE; i++) {
   const urlmass=json.results[i].mass;
   const urlskin_color= json.results[i].skin_color;
   const urlname= json.results[i].name;
+  const urlhomeworld=json.results[i].homeworld;
+  const urlfilms=json.results[i].films;
+
   // const gens = new People(urlbirth_year, urleye_colo, urlgender, urlhair_color, urlmass,urlskin_color);
   // console.log(gens);
 
+
   PERSONNAGES.innerHTML += 
   `<section class="resultat">
  <h1 class="titreAccordeon">${urlname}</h1>
@@ -72,8 +77,8 @@ for (let i = 0; i < PERPAGE; i++) {
      <div id=couleurCheveux> Couleur des Cheveux : ${urlhair_color} </div>
      <div id= poids> Poids du personnage : ${urlmass}  kg</div>
      <div id= couleurPeau> Couleur de Peau : ${urlskin_color} </div>
-     <div class="2"> 2</div>
-     <div class="3"> 3</div>
+     <div class="2"> Planète de Naissance : ${urlhomeworld}</div>
+     <div class="3"> Film où je suis présent : ${urlfilms}</div>
  </div>
 </section>`;
 
diff --git a/styles/style.css b/styles/style.css
index 20c1c7b..d3121a3 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -57,6 +57,16 @@ div.image-films {
     content: url("../assets/imgs/mando.png");
 
 }
+
+div.image-charactere {
+    background-color: transparent;
+    margin-top: -170px;
+    margin-left: auto;
+    width: 30%;
+    content: url("../assets/imgs/grogu.png");
+}
+
+
 #reponses-films {
     color : #FFF;
     float: left;