isa44.74/mandalorian
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

harmonisation visuelle

Browse source
This commit is contained in:
rasoirnoir 2021-10-19 22:23:22 +02:00
parent ef38db8421
commit 3a80dd388a
No known key found for this signature in database
GPG key ID: 995E4575ADB981A3
7 changed files with 183 additions and 122 deletions
Download patch file Download diff file Expand all files Collapse all files

26
scripts/personnages.js
View file

@ -67,19 +67,19 @@ for (let i = 0; i < PERPAGE; i++) {
PERSONNAGES.innerHTML +=
`<section class="resultat">
<h1 class="titreAccordeon">${urlname}</h1>
<div class="accordeon">
<div class="1">
<div id=annéeNaissance>Année de Naissance : ${urlbirth_year} </div>
<div id=couleurYeux> Couleur des Yeux : ${urleye_colo}</div>
<div id=genre>Genre : ${urlgender}</div>
<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"> Planète de Naissance : ${urlhomeworld}</div>
<div class="3"> Film où je suis présent : ${urlfilms}</div>
</div>
`<section class="resultat accordeon_item">
<h1 class="accordeon_item_header">${urlname}</h1>
<div class="accordeon_item_body">
<div class="1">
<div id=annéeNaissance>Année de Naissance : ${urlbirth_year} </div>
<div id=couleurYeux> Couleur des Yeux : ${urleye_colo}</div>
<div id=genre>Genre : ${urlgender}</div>
<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"> Planète de Naissance : ${urlhomeworld}</div>
<div class="3"> Film où je suis présent : ${urlfilms}</div>
</div>
</section>`;

13
scripts/planets.js
View file

@ -33,9 +33,9 @@ function remplissage(results) {
planetes.innerHTML +=
`<section class="resultat">
<h1 class="titreAccordeon">${nom}</h1>
<div class="accordeon">
`<section class="resultat accordeon_item">
<h1 class="accordeon_item_header">${nom}</h1>
<div class="accordeon_item_body">
<div class="1">
<p>${terrain}</p>
<p>${climate}</p>
@ -47,6 +47,13 @@ function remplissage(results) {
</section>`;
}
const accordeonItemHeader = document.querySelectorAll(".accordeon_item_header");
for (item of accordeonItemHeader) {
item.addEventListener("click", (event) => {
item.classList.toggle("active");
});
}
//Pagination
createPagination(previousUrl, nextUrl, planetes, remplissage);
}

2
scripts/util.js
View file

@ -52,7 +52,7 @@ export const createPagination = (prevUrl, nextUrl, elementParent, remplissage) =
if (prevUrl == null) firstPage = true;
if (nextUrl == null) lastPage = true;
let previousButton = `<button id="prevButton">Page précédente</button>`;
let currentButton = `${currentPage}`;
let currentButton = `<span style="color:#ccc;">${currentPage}</span>`;
let nextButton = `<button id="nextButton">Page suivante</button>`;
elementParent.innerHTML += previousButton;