generated from Carl20cent/r4a10-tp-api-js
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
85 lines (74 loc) · 2.41 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
<title>Pokémon Lookup</title>
<meta charset="utf-8" />
<link rel="shortcut icon" type="image/x-icon" href="./images/favicon.png" />
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<header>
<!-- logo -->
<img src="./images/logo.png">
<p id="explication">
Search for any Pokémon and get its stats, straight from
<a href="https://pokeapi.co/" target="_blank">PokeApi</a>.<br />
You can even make your own teams and keep them for later!
</p>
</header>
<main id="conteneur">
<!-- Section de recherche (avec résultats) -->
<section id="section-recherche">
<div id="bloc-recherche">
<!-- Champ de recherche -->
<input type="text" autocomplete="off" id = "pokemonFind" placeholder="What Pokémon do you need?" list="pokemonList" />
<!-- Boutons -->
<button
id="btn-lancer-recherche"
type="button"
class="btn_clicable"
title="Lancer la recherche"
>
<!-- Icone Loupe (provenant de flaticon.com) -->
<img src="images/loupe.svg" alt="Search icon" width="22" />
</button>
</div>
<!-- Résultats de recherche -->
<div id="bloc-gif-attente" hidden>
<img
src="images/attente-ajax.gif"
alt="Loading GIF"
width="50"
/>
</div>
<p id="error"></p>
<div id="bloc-resultats">
<div id="result1">
</div>
<div id="result2">
</div>
</div>
</section>
<datalist id="pokemonList">
</datalist>
<!-- Section de séparation (invisible) -->
<section id="section-separation"></section>
<!-- Section des recherches favorites -->
<section id="section-favoris">
<h2>Teams</h2>
<p>
Click on a team to show its Pokémon's stats.
</p>
<button id = "newTeam">New team</button>
<button id = "delTeam">Delete team</button>
<button id = "delPoke">Remove Pokemon</button>
<ul id="liste-favoris">
</ul>
</section>
</main>
<script src = "equipe.js"></script>
<script src = "view.js"> </script>
<script src = "dataList.js"> </script>
<script src = "script.js"></script>
</body>
</html>