-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathcollection.html
134 lines (122 loc) · 3.8 KB
/
collection.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
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta name="Description" content="Hello TypeScript" />
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="style.css" />
<title>StarWars API</title>
</head>
<body>
<!--NAVBAR SECTION-->
<nav class="navbar navbar-expand-lg navbar-light bg-light">
<div class="container-fluid p-3">
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarTogglerDemo02"
aria-controls="navbarTogglerDemo02"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo02">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="/"
>Accueil</a
>
</li>
<li class="nav-item">
<a class="nav-link" href="./collection.html">Collection</a>
</li>
</ul>
</div>
</div>
</nav>
<!--END OF NAVBAR SECTION-->
<!--MAIN SECTION-->
<div class="container-md p-3 mt-5 text-center">
<!--btn section-->
<div id="buttons" class="text-center mb-5">
<div
class="btn-group"
role="group"
aria-label="Basic radio toggle button group"
>
<input
type="radio"
class="btn-check"
name="btnradio"
id="btnradio1"
autocomplete="off"
checked
/>
<label class="btn btn-outline-primary" for="btnradio1"
>Personnages</label
>
<input
type="radio"
class="btn-check"
name="btnradio"
id="btnradio2"
autocomplete="off"
/>
<label class="btn btn-outline-primary" for="btnradio2"
>Planètes</label
>
<input
type="radio"
class="btn-check"
name="btnradio"
id="btnradio3"
autocomplete="off"
/>
<label class="btn btn-outline-primary" for="btnradio3">Espèces</label>
<input
type="radio"
class="btn-check"
name="btnradio"
id="btnradio4"
autocomplete="off"
/>
<label class="btn btn-outline-primary" for="btnradio4"
>Vaisseaux</label
>
<input
type="radio"
class="btn-check"
name="btnradio"
id="btnradio5"
autocomplete="off"
/>
<label class="btn btn-outline-primary" for="btnradio5"
>Véhicules</label
>
</div>
</div>
</div>
</div>
<!--SHOW RESULTS SECTION-->
<div id="results" class="card-columns"></div>
<!--END OF SHOW RESULTS SECTION-->
<!--END OF MAIN SECTION-->
<script type="text/javascript" src="collection.js"></script>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p"
crossorigin="anonymous"
></script>
</body>
<footer class="footer fixed-bottom">
<p class="text-center">© Copyright 2022 Simplon Carbonne</p>
</footer>
</html>