-
Notifications
You must be signed in to change notification settings - Fork 0
/
les-races.html
267 lines (260 loc) · 10.7 KB
/
les-races.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
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<base href="https://jean-ely-gendrau.students-laplateforme.io/fansite/" />
<link href="./assets/fansite.css" rel="stylesheet" />
<script src="./assets/js/nav.js"></script>
<title>WowGeek - L'univer passionant de World of Warcraft.</title>
</head>
<body>
<!-- MAIN -->
<main class="in-article">
<!-- HEADER -->
<header>
<video class="background-video" autoplay loop muted>
<source
src="./assets/videos/UH8JZNHE7BY71534102731470.mp4"
type="video/mp4"
/>
</video>
<div class="wrapped-title-races">
<h1 class="header-h1">Citoyens d’Azeroth</h1>
<p class="header-p">
Azeroth est le foyer de nombreuses races différentes, qu’elles y
aient vu le jour ou qu’elles soient originaires d’autres royaumes.
Fier défenseur de l’Alliance ou féroce gardien de la Horde, le choix
de votre race détermine le camp que vous choisissez dans cette
guerre permanente. Vers laquelle de ces deux factions ira votre
loyauté ?
</p>
</div>
</header>
<!-- MENU -->
<nav class="nav-menuHead">
<div class="menuHead" id="WowGeek">
<a title="WowGeeK" class="link-logo" href="./">WoWGeeK</a>
<a title="Acceuil WowGeek" href="./">Acceuil</a>
<a title="Les races" href="./les-races.html">les races</a>
<a title="Les factions" href="./les-factions.html">les factions</a>
<a title="Les classes" href="./les-classes.html">les classes</a>
<a title="Les extansions" href="./les-extansions.html"
>les extansions</a
>
<a title="Contact nous si tu as des suggestions" href="./contact.html"
>Contact</a
>
<a href="javascript:void(0);" class="icon" onclick="showMenuNow()">
</a>
</div>
</nav>
<!-- SECTION -->
<section class="content-races">
<h2 class="h2-content">les races de World of Warcraft</h2>
<p>
World of Warcraft est divisé en deux factions bien distinctes :
l'Alliance et la Horde. Chacun combat pour son propre compte et
possède ses propres races. Deux races de factions opposées ne peuvent
pas s'allier pour combattre un même monstre. Vous ne pourrez donc pas
jouer en groupe avec un Orc si vous êtes un Nain. Ces deux factions se
battront bien évidemment régulièrement. Cependant, si le PvP (le
Player versus Player - Joueur contre Joueur) n'est pas votre tasse de
thé, pas de panique, vous n'avez pas besoin d'y participer. Ceux qui
désirent s'en mettre sur la tronche devront le faire dans des endroits
prédéterminés, comme les arènes ou les champs de bataille.
</p>
<!--ARTICLE-->
<article class="in-card-races">
<h3>Les races de l'Alliance</h3>
<ul class="list-race">
<l1>Humain</l1>
<l1>Nain</l1>
<l1>Elfe de la nuit</l1>
<l1>Gnome</l1>
<l1>Draeneî</l1>
<l1>Worgen</l1>
<l1>Pandaren</l1>
<l1>Dracthyr</l1>
</ul>
</article>
<!--ARTICLE-->
<article class="in-card-races">
<h3>Les races de la Horde</h3>
<ul class="list-race">
<l1>Orc</l1>
<l1>Mort-vivant</l1>
<l1>Tauren</l1>
<l1>Troll</l1>
<l1>Elfe de sang</l1>
<l1>Gobelin</l1>
<l1>Pandaren</l1>
<l1>Dracthyr</l1>
</ul>
</article>
<!-- ASIDE -->
<aside>
Lorem ipsum dolor sit, amet consectetur adipisicing elit. Consectetur
totam laborum neque veniam, eveniet inventore quae optio nostrum natus
recusandae minima delectus debitis necessitatibus doloribus. Maxime
eum cupiditate qui recusandae. Aspernatur ipsa necessitatibus cumque
eum inventore nemo rem facilis ex, incidunt quo, labore nihil
consectetur eius molestiae. Saepe voluptatibus necessitatibus dolorem,
maxime blanditiis qui sunt corrupti deserunt aut? Iusto, cum. Numquam
eligendi ducimus non incidunt aut corporis nobis corrupti hic expedita
magni? Quo dignissimos, voluptas officiis unde culpa ullam obcaecati
molestias repellendus voluptatibus ratione dolorum nam facere quaerat
debitis recusandae? Maiores laudantium alias recusandae voluptatem
quas corrupti ab amet, eaque adipisci deserunt unde, quo debitis
distinctio quidem. Modi, molestias a! Vero quaerat voluptatem quae
cupiditate doloremque soluta nulla debitis nobis. Iste aperiam nemo
animi voluptas voluptates neque ad. Laboriosam, obcaecati enim ex
expedita omnis aliquam nobis officiis vitae quasi cum rerum aut amet
nam repellat error itaque praesentium voluptatum a? Sunt dignissimos
necessitatibus doloremque explicabo dolorum quod provident soluta
numquam fuga quam! Necessitatibus illo reprehenderit perferendis
aliquid id ab cumque dolore, recusandae voluptatum minus soluta
nesciunt ipsam tempora nemo excepturi. Nobis dignissimos excepturi
esse id iste assumenda accusantium accusamus earum blanditiis odio?
Quam sint a odit at similique sunt quos animi tempora esse explicabo
aliquam in ab, velit facilis harum! Ipsam animi qui corrupti totam.
Soluta, quidem voluptate! Qui architecto doloribus deleniti dolore
temporibus quasi laudantium totam earum adipisci itaque ut placeat
blanditiis, illum veniam alias quisquam saepe? Doloribus, tempora.
Quasi numquam consectetur, enim voluptate rem omnis. Placeat nobis,
molestiae consectetur est, recusandae quia sed qui, praesentium itaque
dolorum porro! Facilis ad corporis minima maiores repellendus vero
tempora cum molestias. Nihil ullam cum saepe dolore nulla nam placeat
temporibus, adipisci laudantium at consequatur quaerat beatae ducimus
mollitia similique ad accusantium? Incidunt distinctio assumenda
eligendi enim esse tenetur deleniti beatae nemo.
</aside>
<!-- FIGURE -->
<figure class="video-container">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/kBY2HQ9YtSI"
title="Présentation des 𝗥𝗔𝗖𝗘𝗦 de l'𝗔𝗟𝗟𝗜𝗔𝗡𝗖𝗘 │ Tuto WoW"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen
>
</iframe>
<!-- FIGCAPTION -->
<figcaption>
Présentation des 𝗥𝗔𝗖𝗘𝗦 de l'𝗔𝗟𝗟𝗜𝗔𝗡𝗖𝗘 │ Tuto WoW
</figcaption>
</figure>
<!-- FIGURE -->
<figure class="video-container">
<iframe
width="560"
height="315"
src="https://www.youtube.com/embed/vxXjCOjt9LM"
title="Présentation des 𝗥𝗔𝗖𝗘𝗦 de la 𝗛𝗢𝗥𝗗𝗘 ? │ Tuto WoW"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
allowfullscreen
>
</iframe>
<!-- FIGCAPTION -->
<figcaption>
Présentation des 𝗥𝗔𝗖𝗘𝗦 de la 𝗛𝗢𝗥𝗗𝗘 ? │ Tuto WoW
</figcaption>
</figure>
</section>
</main>
<!-- FOOTER -->
<footer class="footer">
<!-- NAV FOOTER -->
<nav class="old-footer">
<div class="old-footer-logo">
<a title="WowGeeK" class="link-logo" href="./">WoWGeeK</a>
<a
title="Télécharger La source du projet sur GitHub"
href="https://github.com/jean-ely-gendrau/runtrack1-jour-6"
>La source du projet sur GitHub</a
>
</div>
<!-- NAV LINK -->
<div>
<p class="uppercase">WoW GeeK</p>
<div class="menu-footer">
<a class="menu-items-footer" title="Acceuil" href="./">Acceuil</a>
<a
class="menu-items-footer"
title="conditions générales d'utilisation"
href="./"
>CGU</a
>
<a
class="menu-items-footer"
title="Politique de confidentialité"
href="./"
>RGPD</a
>
<a class="menu-items-footer" title="Contact" href="./contact.html"
>Contact</a
>
</div>
</div>
<!-- NAV LINK -->
<div>
<p class="uppercase">L'univer de WoW</p>
<div class="menu-footer">
<a
class="menu-items-footer"
title="Les Factions"
href="./les-factions.html"
>les factions</a
>
<a
class="menu-items-footer"
title="Les Classes"
href="./les-classes.html"
>les classes</a
>
<a
class="menu-items-footer"
title="Les Extansions"
href="./les-extansions.html"
>les extansions</a
>
</div>
</div>
<!-- GoTo WoW -->
<div>
<p class="uppercase">Autre Liens WoW</p>
<div class="menu-footer">
<a
href="https://eu.forums.blizzard.com/fr/wow//"
title="World of Warcraft Forums"
>Forums Blizzard</a
>
<a
href="https://worldofwarcraft.judgehype.com/"
title="JudgeHype: Guides et news pour World of Warcraft"
>JudgeHype</a
>
<a href="https://www.wowhead.com/classic/fr" title="WowHead Classic"
>WowHead Classic</a
>
<p class="footer-button">
<a
href="https://worldofwarcraft.blizzard.com/fr-fr/start"
title="Télécharger World of Warcraft"
>Télécharger et jouer à WoW</a
>
</p>
</div>
</div>
</nav>
<!-- COPYRIGHT -->
<div class="footer-copyright">
© WowGeek - 2023 -
<a title="Mon autre site internet" href="https://lylylinked.vercel.app/"
>lylylinked</a
>
</div>
</footer>
</body>
</html>