Public Access
5
0

Compare commits

..

70 Commits

Author SHA1 Message Date
b2e657498c reparer missions 2025-12-04 20:59:29 -05:00
7c534b1473 reparation site statique images credit et reponse 2025-12-04 20:26:09 -05:00
6fdfeb95aa Correctif logo 2025-12-04 15:38:00 -05:00
8927b8878b Fix logo glitch + erreur corriger dans la remise initiale (probablement un erreur de branche) 2025-12-04 15:28:46 -05:00
9d5dbcb2de style essai 2025-12-04 00:02:59 -05:00
453c5fca07 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-04 00:02:44 -05:00
4678052b69 changer nom des fichiers 2025-12-03 23:58:19 -05:00
26c9d66a42 Fix final 2025-12-03 23:52:49 -05:00
a1115e5d6f Fix aPropos. 2025-12-03 23:47:03 -05:00
a62c28d069 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 23:42:32 -05:00
32b0d3ea0a RENOMMER FICHIER PArtiel 2025-12-03 23:41:50 -05:00
55d95fdff5 Retrait script temporaire 2025-12-03 23:41:44 -05:00
ef7a3603cd Ajout d'un lien pour télécharger la chanson 2025-12-03 23:40:05 -05:00
45b5ca9b53 Correction erreur de virgule 2025-12-03 23:30:13 -05:00
0d4fc0cdaf Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 23:20:24 -05:00
7387f0b83a Finalisation aPropos.html + CSS 2025-12-03 23:20:19 -05:00
a170091129 Diminution des video a 720p 2025-12-03 23:18:14 -05:00
db098654dc ajout entete 2025-12-03 23:05:26 -05:00
31eb6bf609 clean script.js et ajout target_blank et checklist 2025-12-03 23:05:16 -05:00
Andres
ecaf487c96 correction liste 2025-12-03 22:41:50 -05:00
Andres
4517f6c275 correction liste 2025-12-03 22:37:43 -05:00
4e4a0937be maps damn it 2025-12-03 22:37:25 -05:00
Andres
1c729295f7 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 22:32:16 -05:00
Andres
c7ecee7dcc ajout gros tableau 4x4 2025-12-03 22:32:15 -05:00
c9f366fcb8 essai maps 2025-12-03 22:26:22 -05:00
f1c4159a78 Menage dans le code de aPropos.html 2025-12-03 22:23:35 -05:00
e4d2a7dbd7 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 22:03:31 -05:00
c48a22978b Update a la apge aPropos pour la mis een forme 2025-12-03 22:03:28 -05:00
50b012ec96 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 22:01:05 -05:00
2cf8da051b Blur sur glitch 2025-12-03 22:01:04 -05:00
Andres
5dcb76df6c petit changement de taille 2025-12-03 21:53:02 -05:00
Andres
9835cbca11 petit changement de taille 2025-12-03 21:51:32 -05:00
Andres
cdd0cc7a17 images hab koumei 2025-12-03 21:44:58 -05:00
Andres
0af3351b29 ajout koumei habilites 2025-12-03 21:34:11 -05:00
deffdeec50 ajout de rond sur maps 2025-12-03 21:18:41 -05:00
3affba6764 ajout balise audio 2025-12-03 21:16:25 -05:00
LD
ac184a0c24 atteinte du sweet spot pour le visuel vidéo 2025-12-03 21:05:53 -05:00
LD
f97c5a6d63 Tentative d'atteindre le sweet spot pour le fond de vidéo et ajout du message si la balise vidéo n'est pas compatible 2025-12-03 21:04:36 -05:00
LD
69e081c034 modif de la largeur du fond opaque 2025-12-03 21:00:46 -05:00
LD
daebb6a889 tweaking du style pour le fond foncé de la vidéo d'intro 2025-12-03 20:59:23 -05:00
LD
052f838a3e modification d'espaces invisibles(?) dans le texte Index 2025-12-03 20:58:18 -05:00
LD
94156b83f6 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 20:54:58 -05:00
LD
ca154c6150 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 20:50:34 -05:00
84fdadf1e8 changement du glitch a 2.5 sec 2025-12-03 20:48:10 -05:00
LD
9d0959ab6e Réparation de la section 1 d'index et du bouton rencontrez l'équipe 2025-12-03 20:46:43 -05:00
c7ce5a8763 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 20:38:25 -05:00
f5e479f491 Correction orthographique de la page missions.html 2025-12-03 20:38:23 -05:00
fa7b9696b7 Ajout glitch partiel 2025-12-03 20:38:15 -05:00
f7b3a2a626 ajout des videos de Jeremy a GITIGNORE 2025-12-03 20:26:33 -05:00
1bd9cc9200 FULL Cleanup pre-remises : dossier multimedia, FOOTER and NAV 2025-12-03 20:17:52 -05:00
837868e33b missions et aPropos 2025-12-03 19:55:42 -05:00
54ea2620be Stan getting there 🎯 2025-12-03 14:28:45 -05:00
06690f35b4 amelioration style missions 2025-12-03 14:12:27 -05:00
a9be81072a Correction orthographique missions.html 2025-12-03 14:04:09 -05:00
c22c418208 Merge branch 'main' of https://gitea.zkd.ca/Dev_Web/web01 2025-12-03 13:57:28 -05:00
f5e8bab036 MAJ aPropos et missions 2025-12-03 13:57:27 -05:00
5b7c942ca1 Correction orthographique nav + footer dans la page missions.html 2025-12-03 13:57:24 -05:00
71756a7819 Correction orthographique armures.html 2025-12-03 13:52:29 -05:00
e2267e6e30 Correction orthographique aPropos.html 2025-12-03 13:43:45 -05:00
7b1669719d Correction orthographique sousPageLore4.html 2025-12-03 13:35:13 -05:00
677f964736 Correction orthographique sousPageLore3.html 2025-12-03 13:33:04 -05:00
2fbc05fe72 Correction orthographique sousPageLore2.html 2025-12-03 13:30:59 -05:00
89537157e8 Partie 1 - Correction orthographique de la page sousPageLore2.html 2025-12-03 13:22:29 -05:00
b867a00be1 Correction orthographique de la page sousPageLore1.html 2025-12-03 13:11:11 -05:00
01bf035f18 Correction orthographique de la page lore.html 2025-12-03 13:03:40 -05:00
51d591eb92 Correction orthographique de la page index.html 2025-12-03 13:01:45 -05:00
7f6302a7b9 Correction orthographique de la page histoire.html 2025-12-03 12:59:38 -05:00
5f1f27c599 Correction orthographqiue de la page team.html 2025-12-03 12:55:29 -05:00
189dccd74c Correction orthographique de la page reponse.html 2025-12-03 12:52:36 -05:00
90b50a4c91 Correction typographique de la page des crédits 2025-12-03 12:51:41 -05:00
104 changed files with 3742 additions and 772 deletions

30
.gitignore vendored
View File

@@ -508,3 +508,33 @@ $RECYCLE.BIN/
www/medias/mediasCredits/warframeDuviriRide.mp4
www/medias/mediasHistoireDE/warframeRailjackRide.mp4
www/multimedia/mediasCredits/warframeDuviriRide.mp4
www/multimedia/mediasHistoireDE/warframeRailjackRide.mp4
COMPRESS/warframeRailjackRide.mp4
COMPRESS/Ember.mp4
COMPRESS/Equinox.mp4
COMPRESS/Frost.mp4
COMPRESS/Koumei.mp4
COMPRESS/Rhino.mp4
COMPRESS/Sevagoth.mp4
COMPRESS/Voruna.mp4
COMPRESS/warframeDuviriRide.mp4
www/multimediaHQ/we_All_Lift_Together_mPTCq3LiZSE.mp3
www/multimediaHQ/mediasAndres/Ember.mp4
www/multimediaHQ/mediasAndres/EmberVid.webm
www/multimediaHQ/mediasAndres/Equinox.mp4
www/multimediaHQ/mediasAndres/equinox.webm
www/multimediaHQ/mediasAndres/Frost.mp4
www/multimediaHQ/mediasAndres/FrostVid.webm
www/multimediaHQ/mediasAndres/Koumei.mp4
www/multimediaHQ/mediasAndres/KoumeiVid.webm
www/multimediaHQ/mediasAndres/nokko.webm
www/multimediaHQ/mediasAndres/Rhino.mp4
www/multimediaHQ/mediasAndres/RhinoVid.webm
www/multimediaHQ/mediasAndres/Sevagoth.mp4
www/multimediaHQ/mediasAndres/SevagothVid.webm
www/multimediaHQ/mediasAndres/Voruna.mp4
www/multimediaHQ/mediasAndres/VorunaVid.webm
www/multimediaHQ/mediasCredits/warframeDuviriRide.mp4
www/multimediaHQ/mediasHistoireDE/warframeRailjackRide.mp4
www/multimediaHQ/mediasLea/warframeIntro.mp4

View File

@@ -25,6 +25,8 @@
"nhoizey.gremlins",
"s2junn.image-essentials",
"shardulm94.trailing-spaces",
"esbenp.prettier-vscode"
"esbenp.prettier-vscode",
"wassim-k.rename-replace-extension",
"karenpommeroy.batch-rename"
]
}

View File

@@ -28,6 +28,7 @@
- [ ] Lea
- [ ] Stan
- [x] Jeremy
- [ ]
<header> Un entête incluant :
▪ Un logo conçu par vous
@@ -53,7 +54,7 @@ o <main> Le contenu principal de la page
- [x] Logo
- [ ] Une bannière conçue par vous (vous nêtes pas obligés de garder la même sur toutes vos pages)
- [x] Le titre principal de la page Web (vous nêtes pas obligés de garder le même sur toutes vos pages)
- [ ] balise `<nav>`
- [x] balise `<nav>`
- [x] Un bouton pour chaque page du site Web (sous la forme dune liste `<ul>`) avec des effets de CSS
- [x] Trouvez une façon dindiquer sur quelle page se trouve actuellement le visiteur. Ou limplantation dun fil dAriane.
- [x] balise `<footer>`
@@ -63,6 +64,22 @@ o <main> Le contenu principal de la page
- [x] balise `<main>`
- [ ] class dans balise `<body>`
- [x] Inclure les references pour chaques fichier multimedia
- [ ] Au moins un lien de téléchargement
- [ ] Un tableau
- [x] • La dimension du tableau doit être au moins de 4 colonnes et 4 lignes.
- [x] • Il doit y avoir de la fusion à lintérieur du tableau.
- [x] • Les bordures doivent être faites par CSS.
- [ ] Des listes
- [x] • Au moins une liste à puce contenant au moins 3 éléments.
- [ ] • Au moins une liste numérotée contenant au moins 3 éléments.
- [ ] • Au moins une dentre elle doit être une liste imbriquée dau moins 2 éléments supplémentaires.
- [ ] Du contenu multimédia
- [ ] • Au moins un fichier audio
- [x] • Au moins deux fichiers vidéo
- [ ] • Au moins de cinq images différentes (excluant les photos des membres de léquipe, le logo et la
bannière)
- [x] Aucun texte bidon de type Lorem Ipsum ne sera accepté dans le site Web.
- [ ]
```md
. Vous pouvez les ajouter sur une page différente ou sur chaque page contenant les éléments concernés.

2715
log-git-251203.txt Normal file

File diff suppressed because it is too large Load Diff

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<title>À propos</title>
<script src="js/script.js"></script>
@@ -18,11 +18,12 @@
<body class="aProposBG">
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html" class="active">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -31,24 +32,22 @@
</nav>
<main class="aPropos">
<h1>Contactez l'équipe!</h1>
<h1>Contactez léquipe!</h1>
<div class="sidebyside">
<div>
<section class="commentaire">
<!-- utilisation de get pour avoir les variables dans l'url : page statique -->
<!-- si utilisation de serveur dynamique, changer pour POST -->
<form method="get" action="reponse.html">
<h2>Commentaire</h2>
<fieldset id="firstField">
<fieldset id="infoContact">
<legend>Informations de contact</legend>
<div>
<label for="nomComplet">Votre nom complet :</label>
<input id="nomComplet" name="nomComplet" type="text" required minlength="3"
placeholder="Prénom Nom">
<label for="nomComplet">Votre nom complet :</label>
<input id="nomComplet" name="nomComplet" type="text" required minlength="3" placeholder="Prénom Nom">
</div>
<div>
<label for="email">Votre adresse courriel : </label>
<input id="email" name="email" type="email" required
placeholder="(ex. vous@fournisseur.com)" size="30">
<label for="email">Votre adresse courriel : </label>
<input id="email" name="email" type="email" required placeholder="(ex. vous@fournisseur.com)" size="30">
</div>
</fieldset>
<fieldset>
@@ -68,31 +67,34 @@
</div>
</div>
<div>
<label for="pagePrefs" class="formInfo">Page préféré :</label>
<label for="pagePrefs" class="formInfo">Page préférée :</label>
<div>
<select name="page" id="pagePrefs">
<option value="accueil" selected>Page d'accueil</option>
<option value="index" selected>Page d'accueil</option>
<option value="aPropos">À Propos</option>
<option value="team">L'équipe</option>
<option value="reponse" disabled>Réponse</option>
<option value="histoire">Histoire de DE</option>
<optgroup label="Univers Sci-fi">
<option value="sousPageLore1">Arc 1 : Éveil</option>
<option value="sousPageLore2">Arc 2: Saga de la guerre intérieure
<option value="sousPageLore1">Arc 1 : Éveil</option>
<option value="sousPageLore2">Arc 2 : Saga de la guerre intérieure
</option>
<option value="sousPageLore3">Arc 3 : Saga de la nouvelle Guerre
</option>
<option value="sousPageLore4">Arc 4 : Saga de la guerre du Néant
</option>
<option value="sousPageLore3">Arc 3: Saga de la nouvelle Guerre</option>
<option value="sousPageLore4">Arc 4: Saga de la guerre du Néant</option>
</optgroup>
<option value="missions">Missions</option>
<option value="armures">Armures</option>
<option value="credits">Crédits</option>
</select>
</div>
</div>
</div>
<div>
<label>Quel personnage voudriez-vous essayer : </label>
<label>Quel personnage voudriez-vous essayer : </label>
<div class="sidebyside">
<!-- test clickable region no need for in label when surrounding input ?? -->
<label class="clickLabel" for="persoOne">
<input type="checkbox" id="persoOne" name="persoOne" value="1">
Ember</label>
@@ -128,8 +130,7 @@
</div>
</fieldset>
<fieldset>
<legend>Votre appreciations</legend>
<!-- TODO : for="niveau" -->
<legend>Votre appréciation</legend>
<textarea name="zoneComment" rows="10" cols="80"
placeholder="Quelque chose à ajouter?"></textarea>
</fieldset>
@@ -138,79 +139,39 @@
<button type="reset">Réinitialiser</button>
</div>
</form>
</div>
<div>
</section>
<section class="coordonnees">
<div id="contactInfo">
<div>
<div>
<h2>Coordonnées</h2>
<div>
<p>Adresse : <a target="_blank"
href="https://www.google.com/maps/dir//C%C3%A9gep+De+Sherbrooke+475+Rue+du+C%C3%A9gep+Sherbrooke,+Quebec+J1E+4K1/@45.4111141,-71.8863288,16z/data=!4m8!4m7!1m0!1m5!1m1!1s0x4cb7b3a7a1058a9f:0xac83ae2c6ba0672c!2m2!1d-71.8863288!2d45.4111141?entry=ttu&g_ep=EgoyMDI1MTEyMy4xIKXMDSoASAFQAw%3D%3D">
475 Rue du Cégep, Sherbrooke, QC J1E 4K1</a></p>
<p>Pour plus d'information sur les créateurs : <a target="_blank"
href="https://www.cegepsherbrooke.qc.ca/">Cégep de Sherbrooke</a></p>
<p>Téléphone : <a href="tel:+18195646350">+18195646350</a></p>
</div>
</div>
<h2>Coordonnées</h2>
<div class="grille">
<p id="titreAdresse">Adresse :</p>
<a id="contenuAdresse" target="_blank" href="https://www.google.com/maps/dir//C%C3%A9gep+De+Sherbrooke+475+Rue+du+C%C3%A9gep+Sherbrooke,+Quebec+J1E+4K1/@45.4111141,-71.8863288,16z/data=!4m8!4m7!1m0!1m5!1m1!1s0x4cb7b3a7a1058a9f:0xac83ae2c6ba0672c!2m2!1d-71.8863288!2d45.4111141?entry=ttu&g_ep=EgoyMDI1MTEyMy4xIKXMDSoASAFQAw%3D%3D"> 475 rue du Cégep, Sherbrooke, QC J1E 4K1</a>
<div>
<div>
<p>Courriel :
<a target="_blank" href="mailto:empty@zkd.ca">Equipe ALT-F4</a>
</p>
<div class="conteneurMaps">
<iframe title="Maps pour cegep"
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2800.9120010040356!2d-71.88890908663183!3d45.41111407095251!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x4cb7b3a7a1058a9f%3A0xac83ae2c6ba0672c!2sC%C3%A9gep%20De%20Sherbrooke!5e0!3m2!1sen!2sca!4v1764356213744!5m2!1sen!2sca"
width="600" height="450" allowfullscreen="" loading="lazy"
referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
</div>
<p id="titreInfo">Pour plus dinformation sur les créateurs :</p>
<a id="contenuInfo" target="_blank" href="https://www.cegepsherbrooke.qc.ca/">Cégep de Sherbrooke</a>
<p id="titreTelephone">Téléphone :</p>
<a id="contenuTelephone" href="tel:+18195646350">+1 (819) 564-6350</a>
<p id="titreCourriel">Courriel :</p>
<a id="contenuCourriel" target="_blank" href="mailto:empty@zkd.ca">Équipe Les Alt-F4</a>
</div>
<div class="conteneurMaps">
<iframe id="mapsFrame" title="Maps pour cégep" src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d5601.823999127039!2d-71.8863288!3d45.4111141!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sfr!2sca!4v1764819112867!5m2!1sfr!2sca" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
</div>
</div>
<!--
FIXME: Input nom et courriel largeur
FIXME: Centrer les div et fond-d'ecran
FIXME: Padding 2e box ...
Contenu minimal de la page de contact de votre site Web :
• <main> Le contenu principal de la page
o Des informations de contact sous forme de :
▪ Des coordonnées (adresse civique, adresse courriel, etc.) (peuvent être fictives)
▪ Une carte interactive (Google maps, etc.)
475 Rue du Cégep, Sherbrooke, QC J1E 4K1
https://www.cegepsherbrooke.qc.ca/
+18195646350
o Un formulaire de type « contactez-nous » :
▪ Deux zones de texte monolignes
▪ Une zone de texte multilignes
▪ Une liste déroulante
▪ Des choix sous forme de cases à cocher
▪ Des choix sous forme de boutons radio
▪ Un bouton de réinitialisation du formulaire
▪ Un bouton denvoi du formulaire
o Lors de son envoi, le formulaire doit faire afficher une nouvelle page contenant un message de remerciement
pour avoir complété le formulaire (ex : reponse.html). Cette page devra être créé en plus des autres pages
demandées.
-->
</div>
</div>
</section>
</div>
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Stanislas Royal.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Armures</title>
@@ -18,11 +18,12 @@
<body>
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -32,7 +33,7 @@
<main class="armures">
<header class="video-header">
<video id="entete" src="./medias/mediasAndres/nokko.webm" autoplay muted loop></video>
<video id="entete" src="multimedia/mediasAndres/nokko.webm" autoplay muted loop></video>
<h1 id="title">Armures</h1>
<nav class="wf-nav">
@@ -50,7 +51,7 @@
<section class="descarmure">
<div class="armtxt">
<h2>Que sont les armures(Warframes) ?</h2>
<h2>Que sont les armures (Warframes)?</h2>
<p>Les Warframes sont des armes vivantes, des armures de combat biomécaniques façonnées pour incarner la
volonté des Tennos. Mi-technologie, mi-créature, chacune delles canalise lénergie du Néant pour
déchaîner des pouvoirs dévastateurs et accomplir des prouesses physiques impossibles. Nées des
@@ -58,7 +59,7 @@
ou
de lessence du Tenno qui les contrôle.
Plus que de simples armures, elles sont des extensions de lâme du Tenno : rapides, agiles,
Plus que de simples armures, elles sont des extensions de lâme du Tenno : rapides, agiles,
destructrices, ou protectrices. Chaque Warframe possède son propre style de combat, ses capacités
uniques et son histoire profondément liée aux cicatrices du passé. Ensemble, Tenno et Warframe
forment
@@ -69,7 +70,7 @@
<section id="Ember" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/EmberVid.webm" type="video/webm">
<source src="multimedia/mediasAndres/emberVid.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -77,7 +78,7 @@
<div class="content">
<h2>Ember</h2>
<p>
Des étoiles flamboyantes embrasent nos mondes. Aussi ardente que le soleil, la rage d'Ember consume
Des étoiles flamboyantes embrasent nos mondes. Aussi ardente que le soleil, la rage dEmber consume
ses
ennemis et disperse leurs cendres dans
le vent solaire. Impératrice des flammes élémentaires, embrase la terre de ses feux sauvages.
@@ -92,11 +93,11 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Ember/habEmber.PNG" alt="hh">
<img src="./images/imagesAndres/Ember/habEmber.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Ember.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/ember.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -105,7 +106,7 @@
<section id="Equinox" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/equinox.webm" type="video/webm">
<source src="multimedia/mediasAndres/equinox.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -113,11 +114,11 @@
<div class="content">
<h2>Equinox</h2>
<p>
Incarnation de forces opposées en une seule entité, Equinox déchaîne sa colère comme l'aube
Incarnation de forces opposées en une seule entité, Equinox déchaîne sa colère comme laube
naissante,
ou marque la fin de la vie comme le crépuscule.
Alternant entre deux formes, elle peut renforcer les Tenno dans la lumière ou leur offrir un répit
réparateur dans l'obscurité. <a href="https://www.warframe.com/" target="_blank">Site officiel de
réparateur dans lobscurité. <a href="https://www.warframe.com/" target="_blank">Site officiel de
Warframe</a>
</p>
<br>
@@ -126,10 +127,10 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Equinox/equinoxHab.PNG" alt="hh">
<img src="./images/imagesAndres/Equinox/equinoxHab.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Equinox.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/equinox.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -138,7 +139,7 @@
<section id="Frost" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/FrostVid.webm" type="video/webm">
<source src="multimedia/mediasAndres/frostVid.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -146,7 +147,7 @@
<div class="content">
<h2>Frost</h2>
<p>
Frost est un Warframe lent et lourdement blindé, capable d'utiliser ses compétences offensives et
Frost est un Warframe lent et lourdement blindé, capable dutiliser ses compétences offensives et
défensives à son avantage et à celui de
son équipe. Il déchaîne de furieux blizzards qui terrassent et gèlent ses ennemis, tout en offrant
répit
@@ -159,10 +160,10 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Frost/frostHab.PNG" alt="hh">
<img src="./images/imagesAndres/Frost/frostHab.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Frost.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/frost.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -171,7 +172,7 @@
<section id="Koumei" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/KoumeiVid.webm" type="video/webm">
<source src="multimedia/mediasAndres/koumeiVid.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -179,11 +180,11 @@
<div class="content">
<h2>Koumei</h2>
<p>
Tisse les fils du destin, à la fois couturière, prophétesse et marionnette. Ose miser sur l'avenir
d'Origin, prends des risques,
Tisse les fils du destin, à la fois couturière, prophétesse et marionnette. Ose miser sur lavenir
dOrigin, prends des risques,
laisse la chance te guider. Défie le destin, recommence et échappe à sa spirale indemne, comme la
Vierge aux Dés, Koumei.
Protège-toi par des charmes providentiels, puis répands le malheur sur tes ennemis, afin qu'eux
Protège-toi par des charmes providentiels, puis répands le malheur sur tes ennemis, afin queux
aussi soient suspendus aux ficelles des
Tenno. <a href="https://www.warframe.com/" target="_blank">Site officiel de Warframe</a>
</p>
@@ -193,10 +194,10 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Koumei/koumeiHab.PNG" alt="hh">
<img src="./images/imagesAndres/Koumei/koumeiHab.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Koumei.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/koumei.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -205,7 +206,7 @@
<section id="Rhino" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/RhinoVid.webm" type="video/webm">
<source src="multimedia/mediasAndres/rhinoVid.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -214,8 +215,8 @@
<h2>Rhino</h2>
<p>Rhino est un Warframe lourdement blindé, doté de la force et de la robustesse de son homonyme
intrépide et impétueux. Privilégiant la
puissance à la vitesse, Rhino est conçu pour jouer le rôle de tank au sein d'une cellule. Capable de
foncer dans la mêlée, d'attirer
puissance à la vitesse, Rhino est conçu pour jouer le rôle de tank au sein dune cellule. Capable de
foncer dans la mêlée, dattirer
les tirs ennemis et de plier le champ de bataille à sa volonté par la seule force brute, il est
capable de tout contrôler. <a href="https://www.warframe.com/" target="_blank">Site officiel de
Warframe</a>
@@ -226,10 +227,10 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Rhino/rhinoHab.PNG" alt="hh">
<img src="./images/imagesAndres/Rhino/rhinoHab.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Rhino.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/rhino.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -238,7 +239,7 @@
<section id="Sevagoth" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/SevagothVid.webm" type="video/webm">
<source src="multimedia/mediasAndres/sevagothVid.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -246,9 +247,9 @@
<div class="content">
<h2>Sevagoth</h2>
<p>
Perdu dans un voyage à la dérive à travers le Vaste Intemporel, le sombre timonier Sevagoth
apprivoise l'inéluctable mortalité au milieu
des tempêtes traîtresses du Néant. Il revient éternellement d'outre-tombe, tandis que son Ombre
Perdu dans un voyage à la dérive à travers le Vaste intemporel, le sombre timonier Sevagoth
apprivoise linéluctable mortalité au milieu
des tempêtes traîtresses du Néant. Il revient éternellement doutre-tombe, tandis que son Ombre
éclipse la lumière et moissonne
les âmes damnées pour assouvir sa soif insatiable de ténèbres. <a href="https://www.warframe.com/"
target="_blank">Site officiel de Warframe</a>
@@ -259,10 +260,10 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Sevagoth/sevagothHab.PNG" alt="hh">
<img src="./images/imagesAndres/Sevagoth/sevagothHab.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Sevagoth.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/sevagoth.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -271,7 +272,7 @@
<section id="Voruna" class="perso">
<video class="bg-video" autoplay muted loop playsinline>
<source src="./medias/mediasAndres/VorunaVid.webm" type="video/webm">
<source src="multimedia/mediasAndres/vorunaVid.webm" type="video/webm">
</video>
<div class="bg-overlay"></div>
@@ -282,8 +283,8 @@
Faites attention au hurlement glacial qui annonce la reprise de la chasse primordiale. La nuit tombe
sur le sanctuaire sacré éclairé par la
lune, où rôdent des bêtes sacrées aux griffes et aux crocs acérés. Écoutez la reine des loups,
Voruna, car c'est ici qu'elle décrète
son festin de minuit. Se délectant d'un carnage sauvage, ses fidèles loups, les silencieux Dynar,
Voruna, car cest ici quelle décrète
son festin de minuit. Se délectant dun carnage sauvage, ses fidèles loups, les silencieux Dynar,
les chaotiques Raksh,
les voraces Lycath et les féroces Ulfrun, ravagent leurs proies une fois lâchées. Sous la lueur
lunaire, sur un sol écarlate,
@@ -296,10 +297,10 @@
<div class="habilites-row">
<div class="habilites">
<img src="./images/ImagesAndres/Voruna/vorunaHab.PNG" alt="hh">
<img src="./images/imagesAndres/Voruna/vorunaHab.PNG" alt="hh">
</div>
<div class="habilites-video">
<video src="./medias/mediasAndres/Voruna.mp4" autoplay muted loop playsinline></video>
<video src="multimedia/mediasAndres/voruna.mp4" autoplay muted loop playsinline></video>
</div>
</div>
</div>
@@ -324,16 +325,60 @@
<tr>
<td>
<img src="./images/ImagesAndres/Excalibur.PNG" alt="Excalibur">
<img src="./images/imagesAndres/Excalibur.PNG" alt="Excalibur">
</td>
<td>
<img src="./images/ImagesAndres/mag.PNG" alt="Mag">
<img src="./images/imagesAndres/mag.PNG" alt="Mag">
</td>
<td>
<img src="./images/ImagesAndres/Nokko.PNG" alt="Nokko">
<img src="./images/imagesAndres/Nokko.PNG" alt="Nokko">
</td>
<td>
<img src="./images/ImagesAndres/Nova.PNG" alt="Nova">
<img src="./images/imagesAndres/Nova.PNG" alt="Nova">
</td>
</tr>
<tr>
<td colspan="4">Compétences</td>
</tr>
<tr>
<td>
<li>
<ul>
<li>Coupe éphémère</li>
<li>Flash radial</li>
<li>Javelot radial</li>
<li>Épée exaltée</li>
</ul>
</li>
</td>
<td>
<li>
<ul>
<li>Abruti</li>
<li>Magnétiser</li>
<li>Polariser</li>
<li>Écraser</li>
</ul>
</li>
</td>
<td>
<li>
<ul>
<li>Peste fongique</li>
<li>Béret lumineux</li>
<li>Enracinement</li>
<li>Rebond de Spore</li>
</ul>
</li>
</td>
<td>
<ul>
<li>Étoile nulle</li>
<li>Goutte d'antimatière</li>
<li>Trou de ver</li>
<li>Imprégnation moléculaire</li>
</ul>
</li>
</td>
</tr>
</table>
@@ -342,63 +387,28 @@
<section class="wikiwar">
<div class="wikiinfo">
<h2>Pour plus d'informations vous pouvez consulter la wiki de Warframe⬇</h2>
<p>Faite click sur l'image pour se rendre!</p>
<h2>Pour plus dinformations, vous pouvez consulter le wiki de Warframe⬇</h2>
<p>Faite clic sur limage pour se rendre!</p>
</div>
<div class="accueilwiki">
<a href="https://wiki.warframe.com/">
<img src="./images/ImagesAndres/accueilWiki.PNG" alt="jdjj">
<a target="_blank" href="https://wiki.warframe.com/">
<img src="./images/imagesAndres/accueilWiki.PNG" alt="jdjj">
</a>
</div>
<div class="accueilwiki">
<a href="https://wiki.warframe.com/w/Warframes">
<img src="./images/ImagesAndres/warframeWiki.PNG" alt="fsfsf">
<a target="_blank" href="https://wiki.warframe.com/w/Warframes">
<img src="./images/imagesAndres/warframeWiki.PNG" alt="fsfsf">
</a>
</div>
<div class="wikiinfo">
<h2>Si vous avez des questions⬇</h2>
</div>
<div class="contact-lists">
<h2>Moyens de communication</h2>
<ol>
<li>Téléphone : 514-555-9283</li>
<li>Instagram : @AltF4_Official</li>
<li>Twitter / X : @AltF4Team</li>
<li><a href="mailto:davidescorcia.ca@mail.com">Envoyer un e-mail</a></li>
</ol>
<br>
<h2>Réseaux associés</h2>
<ul>
<li>Communautés en ligne
<ul>
<li>Serveur Discord Communauté ALT-F4</li>
<li>Forum officiel Warframe Section ALT-F4</li>
</ul>
</li>
<li>Contenus multimédias
<ul>
<li>Chaîne YouTube ALT-F4</li>
<li>Live Twitch hebdomadaire</li>
</ul>
</li>
</ul>
</div>
</section>
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Andres David Herrera Escorcia.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Crédits</title>
@@ -18,11 +18,12 @@
<body>
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -44,9 +45,11 @@
<div class="box">
<h2>Warframe</h2>
<p class="contenu">
Le site internet de Warframe a été consulté afin dobtenir des images et vidéos authentiques du jeu.
Le site internet de Warframe a été consulté afin dobtenir des images et vidéos authentiques du
jeu.
</p>
<div class="bouton"><a href="https://www.warframe.com/fr/game/about">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://www.warframe.com/fr/game/about">Voir la
source</a></div>
</div>
</article>
@@ -55,7 +58,8 @@
<h2>Léa Dezothez</h2>
<ul>
<li class="contenu">
Pour connaître le rôle de Léa, rendez-vous sur la page de léquipe en cliquant sur le bouton.
Pour connaître le rôle de Léa, rendez-vous sur la page de léquipe en cliquant sur le
bouton.
</li>
<li class="contenu">
Léa a également fourni la vaste majorité des images.
@@ -70,10 +74,12 @@
<h2>Jérémy Hébert</h2>
<ul>
<li class="contenu">
Pour connaître le rôle de Jérémy, rendez-vous sur la page de léquipe en cliquant sur le bouton.
Pour connaître le rôle de Jérémy, rendez-vous sur la page de léquipe en cliquant sur le
bouton.
</li>
<li class="contenu">
Jérémy a également fourni les logos ainsi que limage se trouvant dans la page de réponse au formulaire.
Jérémy a également fourni les logos ainsi que limage se trouvant dans la page de réponse au
formulaire.
</li>
</ul>
<div class="bouton"><a href="team.html#jeremy">Voir la personne</a></div>
@@ -94,7 +100,8 @@
<div class="box">
<h2>Stanislas Royal</h2>
<p class="contenu">
Pour connaître le rôle de Stanislas, rendez-vous sur la page de léquipe en cliquant sur le bouton.
Pour connaître le rôle de Stanislas, rendez-vous sur la page de léquipe en cliquant sur le
bouton.
</p>
<div class="bouton"><a href="team.html#stanislas">Voir la personne</a></div>
</div>
@@ -106,7 +113,8 @@
<p class="contenu">
Discotools.xyz a permis la création du bouclier présent dans le logo ainsi que le favicon.
</p>
<div class="bouton"><a href="https://discotools.xyz/fr/icons-editor">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://discotools.xyz/fr/icons-editor">Voir la
source</a></div>
</div>
</article>
@@ -114,9 +122,10 @@
<div class="box">
<h2>Figma</h2>
<p class="contenu">
Figma a été utilisé dans la conception du logo, du favicon et de limage de remerciement pour avoir rempli le formulaire.
Figma a été utilisé dans la conception du logo, du favicon et de limage de remerciement pour
avoir rempli le formulaire.
</p>
<div class="bouton"><a href="https://www.figma.com/fr-fr/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://www.figma.com/fr-fr/">Voir la source</a></div>
</div>
</article>
@@ -124,9 +133,11 @@
<div class="box">
<h2>Lyco Canario</h2>
<p class="contenu">
Lyco Canario est derrière la poule utilisée dans limage de remerciement pour avoir rempli le formulaire.
Lyco Canario est derrière la poule utilisée dans limage de remerciement pour avoir rempli le
formulaire.
</p>
<div class="bouton"><a href="https://dribbble.com/lycocanario">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://dribbble.com/lycocanario">Voir la source</a>
</div>
</div>
</article>
@@ -136,7 +147,8 @@
<p class="contenu">
Visual Studio Code a été loutil de développement utilisé pour lensemble du projet.
</p>
<div class="bouton"><a href="https://code.visualstudio.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://code.visualstudio.com/">Voir la source</a>
</div>
</div>
</article>
@@ -144,9 +156,12 @@
<div class="box">
<h2>/noclip</h2>
<p class="contenu">
Le documentaire sur Warframe conçu par /noclip a servi à rédiger la page sur lhistoire de Digital Extremes.
Le documentaire sur Warframe conçu par /noclip a servi à rédiger la page sur lhistoire de
Digital Extremes.
</p>
<div class="bouton"><a href="https://www.youtube.com/watch?v=UOE6528pwFc&list=PL-THgg8QnvU7Weo1mCM9H2AXljC7UrDm8&index=2">Voir la source</a></div>
<div class="bouton"><a target="_blank"
href="https://www.youtube.com/watch?v=UOE6528pwFc&list=PL-THgg8QnvU7Weo1mCM9H2AXljC7UrDm8&index=2">Voir
la source</a></div>
</div>
</article>
@@ -156,7 +171,9 @@
<p class="contenu">
La théorie fournie par le corps professoral a dépanné léquipe à de multiples reprises.
</p>
<div class="bouton"><a href="https://moodle.cegepsherbrooke.qc.ca/course/view.php?id=1518">Voir la source</a></div>
<div class="bouton"><a target="_blank"
href="https://moodle.cegepsherbrooke.qc.ca/course/view.php?id=1518">Voir la
source</a></div>
</div>
</article>
@@ -166,7 +183,7 @@
<p class="contenu">
Les systèmes de Gitea ont permis un travail connecté durant lensemble du projet.
</p>
<div class="bouton"><a href="https://about.gitea.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://about.gitea.com/">Voir la source</a></div>
</div>
</article>
@@ -176,7 +193,7 @@
<p class="contenu">
ChatGPT a permis la rédaction de certains textes du site.
</p>
<div class="bouton"><a href="https://chatgpt.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://chatgpt.com/">Voir la source</a></div>
</div>
</article>
@@ -186,7 +203,7 @@
<p class="contenu">
Gemini a permis la rédaction de certains textes du site.
</p>
<div class="bouton"><a href="https://gemini.google.com/app">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://gemini.google.com/app">Voir la source</a></div>
</div>
</article>
@@ -194,9 +211,10 @@
<div class="box">
<h2>Moqups</h2>
<p class="contenu">
Moqups a permis la création de la maquette, afin de rendre prévisible le style artistique du site.
Moqups a permis la création de la maquette, afin de rendre prévisible le style artistique du
site.
</p>
<div class="bouton"><a href="https://moqups.com/fr/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://moqups.com/fr/">Voir la source</a></div>
</div>
</article>
@@ -206,7 +224,7 @@
<p class="contenu">
Google Maps a permis lintégration de la carte géographique sur le site.
</p>
<div class="bouton"><a href="https://www.google.com/maps">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://www.google.com/maps">Voir la source</a></div>
</div>
</article>
@@ -216,7 +234,7 @@
<p class="contenu">
Les valideurs du World Wide Web Consortium ont permis la révision du code de lensemble du site.
</p>
<div class="bouton"><a href="https://validator.w3.org/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://validator.w3.org/">Voir la source</a></div>
</div>
</article>
@@ -226,7 +244,7 @@
<p class="contenu">
Le moteur de recherche Brave Search a dépanné a de multiples reprises.
</p>
<div class="bouton"><a href="https://search.brave.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://search.brave.com/">Voir la source</a></div>
</div>
</article>
@@ -236,7 +254,7 @@
<p class="contenu">
Le moteur de recherche Google a dépanné à de multiples reprises.
</p>
<div class="bouton"><a href="https://www.google.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://www.google.com/">Voir la source</a></div>
</div>
</article>
@@ -246,7 +264,7 @@
<p class="contenu">
Le moteur de recherche DuckDuckGo a dépanné à de multiples reprises.
</p>
<div class="bouton"><a href="https://duckduckgo.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://duckduckgo.com/">Voir la source</a></div>
</div>
</article>
@@ -256,7 +274,7 @@
<p class="contenu">
Loutil paint.net a permis lédition de plusieurs images présentes sur le site.
</p>
<div class="bouton"><a href="https://www.getpaint.net/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://www.getpaint.net/">Voir la source</a></div>
</div>
</article>
@@ -266,7 +284,18 @@
<p class="contenu">
Le site de Google Fonts a permis de trouver une police pour le site.
</p>
<div class="bouton"><a href="https://fonts.google.com/">Voir la source</a></div>
<div class="bouton"><a target="_blank" href="https://fonts.google.com/">Voir la source</a></div>
</div>
</article>
<article>
<div class="box">
<h2>PlayWarframe</h2>
<p class="contenu">
La chaine Youtube officielle de Waframe a permis d'obtenir la musique «We All Lift Together».
</p>
<div class="bouton"><a target="_blank" href="multimedia/we_All_Lift_Together_mPTCq3LiZSE.mp3"
download>Télécharger la musique</a></div>
</div>
</article>
</section>
@@ -276,7 +305,7 @@
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Jérémy Hébert.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

View File

@@ -17,44 +17,6 @@
box-sizing: border-box;
}
/** SECTION modifier par script **/
#updateDate {
visibility: hidden;
display: none;
}
#updateDateV {
visibility: visible;
display: block;
background-color: yellow;
font-weight: bold;
color: black;
}
#updateDateW {
visibility: visible;
display: block;
font-weight: bold;
color: white;
}
#pageCouranteNAV {
text-shadow: violet 2px;
box-shadow: #ffefe5;
}
/** FIN DE SECTION modifier par script **/
.sidebyside {
display: flex;
}
.centered {
text-align: center;
margin: auto;
display: block;
}
body {
min-height: 100vh;
/* Pour footer at bottom from : https://douiri.org/blog/fix-footer-bottom-css/ */
@@ -180,7 +142,7 @@ footer a:hover {
.accueil #video {
width: 100%;
height: auto;
height: 100%;
display: block;
}
@@ -188,8 +150,8 @@ footer a:hover {
background-color: #13172cb0;
position: absolute;
top: 5%;
height: 118.5%;
left: 50%;
padding-bottom: 36.6%;
transform: translate(-50%, 0);
z-index: 10;
}
@@ -290,7 +252,6 @@ footer a:hover {
/****************************/
.aProposBG {
background: url('../images/imageSR/Warframe0006.webp') center/cover fixed;
width: 100vw;
height: 100vh;
}
@@ -299,15 +260,40 @@ footer a:hover {
display: block;
}
.aPropos .sidebyside {
display: flex;
max-width: 100%;
}
.aPropos .sidebyside section.commentaire,
.aPropos .sidebyside section.coordonnees {
width: 50%;
margin: 16px;
}
/* FROM: https://www.w3schools.com/howto/howto_css_equal_height.asp */
.aPropos .col-container {
display: table;
}
.aPropos .col {
display: table-cell;
/* Make elements inside the container behave like table cells */
}
.aPropos .centered {
text-align: center;
margin: auto;
display: block;
}
.aPropos h1 {
text-align: center;
}
.aPropos>div:first {
.aPropos>main>div:first {
margin: auto;
display: flex;
/* min-height: calc(100vh - 60px); */
/* display: block; */
align-content: center;
text-align: center;
}
@@ -316,22 +302,8 @@ footer a:hover {
max-width: 700px;
max-height: 600px;
overflow: scroll;
margin-top: 3em;
}
.aPropos .conteneurMaps­ iframe {
border: 0;
margin: 10px;
display: block;
}
.aPropos .sidebyside>div {
margin: 5px 20px;
}
.aPropos .sidebyside>h1 {
width: 120%;
margin-top: 2em;
padding: 1em;
}
.aPropos textarea {
@@ -339,27 +311,14 @@ footer a:hover {
width: 100%;
}
.aPropos form {
width: 70ch;
width: 100%;
height: 100%;
margin: auto;
background-color: #726F9A;
border-radius: 15px;
padding: 10px;
border-radius: 20px;
padding: 16px;
color: #E6ECF3;
overflow: scroll;
/*!SECTION COULEUR
#B47871
#641A10
#13172C
#726F9A
#273A56
#C19F8A
Couleur texte : #FFEFE5
*/
}
.aPropos p {
@@ -368,26 +327,98 @@ Couleur texte : #FFEFE5
.aPropos #contactInfo {
background-color: #273A56;
padding: 10px;
border-radius: 15px;
padding: 1em;
border-radius: 20px;
color: #E6ECF3;
width: 100%;
}
.aPropos a:link {
.aPropos .grille {
display: grid;
grid-template-areas:
"titreAdresse contenuAdresse"
"titreInfo contenuInfo"
"titreTelephone contenuTelephone"
"titreCourriel contenuCourriel";
grid-template-columns: 1fr 2fr;
}
.aPropos .grille #titreAdresse {
grid-area: titreAdresse;
text-align: left;
}
.aPropos .grille #contenuAdresse {
grid-area: contenuAdresse;
text-align: right;
}
.aPropos .grille #titreInfo {
grid-area: titreInfo;
text-align: left;
}
.aPropos .grille #contenuInfo {
grid-area: contenuInfo;
text-align: right;
}
.aPropos .grille #titreTelephone {
grid-area: titreTelephone;
text-align: left;
}
.aPropos .grille #contenuTelephone {
grid-area: contenuTelephone;
text-align: right;
}
.aPropos .grille #titreCourriel {
grid-area: titreCourriel;
text-align: left;
}
.aPropos .grille #contenuCourriel {
grid-area: contenuCourriel;
text-align: right;
}
.aPropos .grille #contenuAdresse,
.aPropos .grille #contenuInfo,
.aPropos .grille #contenuTelephone,
.aPropos .grille #contenuCourriel {
color: #E6ECF3;
font-weight: 800;
text-decoration: underline;
text-align: right;
float: right;
}
.aPropos a:visited {
.aPropos .grille #contenuAdresse:hover,
.aPropos .grille #contenuInfo:hover,
.aPropos .grille #contenuTelephone:hover,
.aPropos .grille #contenuCourriel:hover {
color: #c19f8a;
}
.aPropos a:hover {
color: #726F9A;
/* Hide scrollbar for Chrome, Safari and Opera */
.conteneurMaps::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar for IE, Edge and Firefox */
.conteneurMaps {
-ms-overflow-style: none;
/* IE and Edge */
scrollbar-width: none;
/* Firefox */
padding: 0;
margin: auto;
width: 100%;
}
.aPropos #mapsFrame {
border-radius: 20px;
width: 100%;
height: 400px;
}
.aPropos .sidebyside label {
@@ -405,24 +436,20 @@ Couleur texte : #FFEFE5
margin: 1em auto 1em 0px;
}
.aPropos #contactInfo h2 {
.aPropos h2 {
margin-bottom: 1em;
}
.aPropos #firstField label {
.aPropos #infoContact label {
width: 11em;
display: inline-block
}
.aPropos #firstField input {
.aPropos #infoContact input {
width: 25em;
display: inline-block
}
/*.aPropos div {*/
/* display: block; */
/*}*/
/****************************/
/* PAGE: L'équipe */
/* AUTEUR: Jérémy Hébert */
@@ -917,33 +944,136 @@ Couleur texte : #FFEFE5
/* PAGE: Missions */
/* AUTEUR: Stanislas Royal */
/****************************/
.missions {
background-color: rgb(43, 189, 226);
width: 100%;
background-color: #273A56;
color: #ffefe5;
text-shadow: 2px 2px 2px #13172c;
}
.missions audio {
margin: 2em auto auto auto;
position: sticky;
top: 65px;
left: 40vh;
width: 70vh;
text-align: center;
}
.missions .sidebyside {
display: flex;
max-width: 100%;
}
.missions section {
max-width: 70vw;
height: 100vh;
border:#273A56 2px solid;
margin: 10vh 10vw;
padding: 3em;
text-align: left;
float: left
height: 40vh;
min-height: 200px;
}
.missions section:nth-child(odd) {
text-align: right;
float: right;
}
/*
.missions section:nth-child(even) {
.missions article {
width: 70vw;
height: 40vh;
margin: 1vh 10vw;
padding: 3em;
text-align: left;
}
*/
.missions section p {
.missions h1,
.missions h2 {
margin-bottom: 2em;
}
.missions>section:first-of-type {
padding: 0 20vw;
}
.missions #autreMissions a:any-link {
color: #bf815b;
text-decoration: underline;
font-weight: 600;
}
.missions section:nth-child(even) article {
text-align: right;
/* float: right; */
}
.missions section:nth-child(odd) article {
text-align: left;
}
.missions section article p {
max-width: 50%;
/* margin: auto;
float: left; */
}
.missions section:nth-child(even)>article>p {
margin: auto 0 auto auto;
text-align: right;
}
#assassination {
background: url('../images/imageSR/qu/assassinat.jpg') center/cover fixed;
}
.missions #missionsInfo {
background: url('../images/imageSR/qu/survie.jpg') center/cover fixed;
}
.missions #survie {
background: url('../images/imageSR/qu/survie.jpg') center/cover fixed;
}
.missions #assassination {
background: url('../images/imageSR/qu/assassinat.jpg') center/cover fixed;
}
.missions #capture {
background: url('../images/imageSR/qu/capture.jpg') center/cover fixed;
}
.missions #defense {
background: url('../images/imageSR/qu/defense.jpg') center/cover fixed;
}
.missions #excavation {
background: url('../images/imageSR/qu/excavation.jpg') center/cover fixed;
}
.missions #extermination {
background: url('../images/imageSR/qu/extermination.jpg') center/cover fixed;
}
.missions #hijack {
background: url('../images/imageSR/qu/detournement.jpg') center/cover fixed;
}
.missions #interception {
background: url('../images/imageSR/qu/interception.jpg') center/cover fixed;
}
.missions #invasion {
background: url('../images/imageSR/qu/invasion.jpg') center/cover fixed;
}
.missions #mobileDefense {
background: url('../images/imageSR/qu/defenseMobile.jpg') center/cover fixed;
}
.missions #sauvetage {
background: url('../images/imageSR/qu/sauvetage.jpg') center/cover fixed;
}
.missions #sabotage {
background: url('../images/imageSR/qu/sabotage.jpg') center/cover fixed;
}
.missions #autreMissions {
background: url('../images/imageSR/qu/sabotageRuches.jpg') center/cover fixed;
}
/****************************/
@@ -1139,6 +1269,10 @@ Couleur texte : #FFEFE5
padding: 10px;
}
.wf-table-simple li {
list-style: none;
}
/****************************/
/* PAGE: Crédits */
/* AUTEUR: Jérémy Hébert */
@@ -1151,7 +1285,7 @@ Couleur texte : #FFEFE5
}
.credits header.introduction {
background: #13172c url("../images/ImagesCredits/Header.webp") center/cover fixed;
background: #13172c url("../images/imagesCredits/Header.webp") center/cover fixed;
background-position: top;
height: 100vh;
display: block;
@@ -1248,7 +1382,7 @@ Couleur texte : #FFEFE5
/* AUTEUR: Jérémy Hébert */
/****************************/
.reponse {
background: #C19F8A url("../images/ImagesReponse/Merci.png") center;
background: #C19F8A url("../images/imagesReponse/Merci.png") center;
background-size: cover;
background-position: top;
color: #ffefe5;

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Histoire de DE</title>
@@ -18,12 +18,13 @@
<body>
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="histoire.html" class="active">Histoire de DE</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html" class="active">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
<li><a href="armures.html">Armures</a></li>
@@ -33,9 +34,9 @@
<main class="histoire">
<header class="introduction">
<div class="introduction">
<h1>L'histoire de Digital Extremes</h1>
<p>Plonger dans l'histoire fascinante de Digital Extremes.</p>
<a href="#contexte">Plus d'infos</a>
<h1>Lhistoire de Digital Extremes</h1>
<p>Plonger dans lhistoire fascinante de Digital Extremes.</p>
<a href="#contexte">Plus dinfos</a>
</div>
</header>
@@ -45,79 +46,131 @@
<div class="box">
<h2 class="titre">La face cachée de Warframe</h2>
<p class="contenuChapitre">
Warframe est aujourdhui un pilier du jeu en ligne, un univers singulier mêlant science-fiction organique et combats rapides. Pourtant, derrière son apparence futuriste, son existence même tient du miracle. Le jeu est né à une époque où Digital Extremes, son studio créateur, était au bord de leffondrement après dix années difficiles. Lhistoire de Warframe est celle dun sauvetage inattendu, dune idée persistante et dune équipe déterminée à se réinventer.
Warframe est aujourdhui un pilier du jeu en ligne, un univers singulier mêlant science-fiction
organique et combats rapides. Pourtant, derrière son apparence futuriste, son existence même
tient du miracle. Le jeu est né à une époque où Digital Extremes, son studio créateur, était au
bord de leffondrement après dix années difficiles. Lhistoire de Warframe est celle dun
sauvetage inattendu, dune idée persistante et dune équipe déterminée à se réinventer.
</p>
</div>
</article>
<article class="grilleDroite" id="chapitre1">
<div class="box">
<h3 class="nomChapitre">Les Premiers Pas de James Schmalz</h3>
<h3 class="nomChapitre">Les premiers pas de James Schmalz</h3>
<p class="contenuChapitre">
Lhistoire commence avec James Schmalz, un passionné qui crée des jeux par loisir bien avant den faire une profession. Pendant ses études universitaires, il réalise un petit jeu, Legends of Murder, vendu à un magazine pour un montant modeste mais révélateur de son potentiel. Inspiré par des œuvres de science-fiction, il conçoit ensuite Solar Winds, qui attire lattention dEpic MegaGames. Ce premier succès est suivi dun autre encore plus important, Epic Pinball, qui lui apporte une notoriété suffisante pour fonder Digital Extremes.
Lhistoire commence avec James Schmalz, un passionné qui crée des jeux par loisir bien avant
den faire une profession. Pendant ses études universitaires, il réalise un petit jeu, Legends
of Murder, vendu à un magazine pour un montant modeste, mais révélateur de son potentiel.
Inspiré par des œuvres de science-fiction, il conçoit ensuite Solar Winds, qui attire
lattention dEpic MegaGames. Ce premier succès est suivi dun autre encore plus important, Epic
Pinball, qui lui apporte une notoriété suffisante pour fonder Digital Extremes.
</p>
</div>
</article>
<article class="grilleGauche" id="chapitre2">
<div class="box">
<h3 class="nomChapitre">La Décennie Unreal Tournament</h3>
<h3 class="nomChapitre">La décennie Unreal Tournament</h3>
<p class="contenuChapitre">
Durant près de dix ans, Digital Extremes collabore étroitement avec Epic Games sur la franchise Unreal Tournament. Les deux studios travaillent presque comme une seule entité, partageant leurs équipes et leurs talents. Cette période voit naître certains des jeux multijoueurs les plus marquants de leur époque. Cependant, lorsque les deux entreprises prennent des chemins différents, Digital Extremes cherche à établir son propre projet ambitieux.
Durant près de dix ans, Digital Extremes collabore étroitement avec Epic Games sur la franchise
Unreal Tournament. Les deux studios travaillent presque comme une seule entité, partageant leurs
équipes et leurs talents. Cette période voit naître certains des jeux multijoueurs les plus
marquants de leur époque. Cependant, lorsque les deux entreprises prennent des chemins
différents, Digital Extremes cherche à établir son propre projet ambitieux.
</p>
</div>
</article>
<article class="grilleDroite" id="chapitre3">
<div class="box">
<h3 class="nomChapitre">Le Piège du Travail à Louer</h3>
<h3 class="nomChapitre">Le piège du Travail à louer</h3>
<p class="contenuChapitre">
Le studio décide alors de se lancer dans un projet interne, Dark Sector, voulu comme une nouvelle grande franchise de science-fiction. Au lieu de leur offrir lindépendance créative, ce prototype les enferme dans un cycle de travail à la demande pour différents éditeurs. Pariah, Warpath, ladaptation PlayStation 3 de Bioshock et une version transformée de Dark Sector sont produits durant cette période. Le studio survit, mais la créativité sérode. Pourtant, au cœur de ces années difficiles, un concept refuse de disparaître : celui dun monde de science-fiction sombre, évolutif, formé darmures vivantes et de technologie organique. Cétait la racine de Warframe.
Le studio décide alors de se lancer dans un projet interne, Dark Sector, voulu comme une
nouvelle grande franchise de science-fiction. Au lieu de leur offrir lindépendance créative, ce
prototype les enferme dans un cycle de travail à la demande pour différents éditeurs. Pariah,
Warpath, ladaptation PlayStation 3 de Bioshock et une version transformée de Dark Sector sont
produits durant cette période. Le studio survit, mais la créativité sérode. Pourtant, au cœur
de ces années difficiles, un concept refuse de disparaître : celui dun monde de science-fiction
sombre, évolutif, formé darmures vivantes et de technologie organique. Cétait la racine de
Warframe.
</p>
</div>
</article>
<article class="grilleGauche" id="chapitre4">
<div class="box">
<h3 class="nomChapitre">Neuf Mois pour Recommencer</h3>
<h3 class="nomChapitre">Neuf mois pour recommencer</h3>
<p class="contenuChapitre">
Lorsque le marché du jeu vidéo se transforme et que les contrats se raréfient, Digital Extremes se retrouve en situation critique. La décision est prise de ressusciter lancienne idée de Dark Sector et den faire un nouveau jeu en ligne. Le studio dispose de neuf mois pour créer un prototype jouable, concevoir un site fonctionnel, bâtir une infrastructure en ligne complète et construire les fondations dun modèle économique. Sans expérience dans le domaine des jeux persistants, léquipe se lance dans une course contre la montre. Lobjectif est clair : sortir un jeu minimal, mais fonctionnel, capable de servir de base pour lavenir.
Lorsque le marché du jeu vidéo se transforme et que les contrats se raréfient, Digital Extremes
se retrouve en situation critique. La décision est prise de ressusciter lancienne idée de Dark
Sector et den faire un nouveau jeu en ligne. Le studio dispose de neuf mois pour créer un
prototype jouable, concevoir un site fonctionnel, bâtir une infrastructure en ligne complète et
construire les fondations dun modèle économique. Sans expérience dans le domaine des jeux
persistants, léquipe se lance dans une course contre la montre. Lobjectif est clair : sortir
un jeu minimal, mais fonctionnel, capable de servir de base pour lavenir.
</p>
</div>
</article>
<article class="grilleDroite" id="chapitre5">
<div class="box">
<h3 class="nomChapitre">Les Premiers Soutiens de la Communauté</h3>
<h3 class="nomChapitre">Les premiers soutiens de la communauté</h3>
<p class="contenuChapitre">
À son lancement, Warframe avance timidement. Digital Extremes propose alors un Pack Fondateur permettant de soutenir le développement du jeu. Les premiers achats surprennent léquipe et leur offrent un encouragement vital. En parallèle, le studio réévalue rapidement son modèle économique. Les premiers systèmes favorisaient trop fortement les joueurs payants, ce qui menaçait de briser la confiance naissante. En janvier 2013, la décision est prise dabandonner ces éléments, marquant la transition vers un modèle plus équitable. Larrivée du jeu sur Steam quelques mois plus tard marque un tournant décisif : le public sélargit brusquement et les revenus permettent enfin au studio de stabiliser sa situation.
À son lancement, Warframe avance timidement. Digital Extremes propose alors un Pack fondateur
permettant de soutenir le développement du jeu. Les premiers achats surprennent léquipe et leur
offrent un encouragement vital. En parallèle, le studio réévalue rapidement son modèle
économique. Les premiers systèmes favorisaient trop fortement les joueurs payants, ce qui
menaçait de briser la confiance naissante. En janvier 2013, la décision est prise dabandonner
ces éléments, marquant la transition vers un modèle plus équitable. Larrivée du jeu sur Steam
quelques mois plus tard marque un tournant décisif : le public sélargit brusquement et les
revenus permettent enfin au studio de stabiliser sa situation.
</p>
</div>
</article>
<article class="grilleGauche" id="chapitre6">
<div class="box">
<h3 class="nomChapitre">LÉvolution Continue</h3>
<h3 class="nomChapitre">Lévolution continue</h3>
<p class="contenuChapitre">
Une fois lurgence de la survie passée, Digital Extremes adopte une philosophie simple : Warframe doit évoluer constamment pour rester attractif. Le studio développe de nouvelles zones, enrichit le système de mouvement, ajoute régulièrement des Warframes et ouvre la porte aux créations de la communauté à travers le programme Tennogen. Cette dynamique saccompagne dun dialogue constant avec les joueurs, rendu possible par des diffusions en direct, des événements communautaires et des mises à jour fréquentes. Les développeurs apprennent à intégrer certaines pratiques inventées par les joueurs eux-mêmes, transformant des exploits en mécaniques officielles lorsque celles-ci améliorent le plaisir de jeu.
Une fois lurgence de la survie passée, Digital Extremes adopte une philosophie simple :
Warframe doit évoluer constamment pour rester attractif. Le studio développe de nouvelles zones,
enrichit le système de mouvement, ajoute régulièrement des Warframes et ouvre la porte aux
créations de la communauté à travers le programme Tennogen. Cette dynamique saccompagne dun
dialogue constant avec les joueurs, rendu possible par des diffusions en direct, des événements
communautaires et des mises à jour fréquentes. Les développeurs apprennent à intégrer certaines
pratiques inventées par les joueurs eux-mêmes, transformant des exploits en mécaniques
officielles lorsque celles-ci améliorent le plaisir de jeu.
</p>
</div>
</article>
<article class="grilleDroite" id="chapitre7">
<div class="box">
<h3 class="nomChapitre">Un Univers Bizarre et Unique</h3>
<h3 class="nomChapitre">Un univers bizarre et unique</h3>
<p class="contenuChapitre">
Lune des forces de Warframe réside dans son identité visuelle et narrative. Plutôt que de sinspirer des productions hollywoodiennes, les artistes du studio se tournent vers des influences européennes, notamment le travail de Moebius. Le résultat est un univers étrange, biomécanique, parfois déroutant, mais toujours distinctif. Chaque élément possède un vocabulaire propre, des Syandanas aux Kavats en passant par les factions dotées de leurs propres caractéristiques culturelles. Ce choix esthétique, parfois clivant, est devenu lune des signatures essentielles du jeu. Ce qui semblait être une barrière à lentrée est devenu un atout, un monde si singulier que ceux qui sy plongent sy attachent profondément.
Lune des forces de Warframe réside dans son identité visuelle et narrative. Plutôt que de
sinspirer des productions hollywoodiennes, les artistes du studio se tournent vers des
influences européennes, notamment le travail de Moebius. Le résultat est un univers étrange,
biomécanique, parfois déroutant, mais toujours distinctif. Chaque élément possède un vocabulaire
propre, des Syandanas aux Kavats en passant par les factions dotées de leurs propres
caractéristiques culturelles. Ce choix esthétique, parfois clivant, est devenu lune des
signatures essentielles du jeu. Ce qui semblait être une barrière à lentrée est devenu un
atout, un monde si singulier que ceux qui sy plongent sy attachent profondément.
</p>
</div>
</article>
<article class="grilleGauche" id="chapitre8">
<div class="box">
<h3 class="nomChapitre">La Transformation en Succès Durable</h3>
<h3 class="nomChapitre">La transformation en succès durable</h3>
<p class="contenuChapitre">
Avec le temps, Warframe devient un exemple rare de jeu en ligne porté par la passion, ladaptabilité et le lien avec sa communauté. Ce qui aurait pu être le dernier espoir dun studio en difficulté devient une œuvre en perpétuelle expansion, façonnée par ses créateurs comme par ses joueurs. Lhistoire de Digital Extremes et de Warframe illustre quun projet né de la nécessité peut devenir une référence, à condition dêtre animé par une vision forte et la volonté de toujours se réinventer.
Avec le temps, Warframe devient un exemple rare de jeu en ligne porté par la passion,
ladaptabilité et le lien avec sa communauté. Ce qui aurait pu être le dernier espoir dun
studio en difficulté devient une œuvre en perpétuelle expansion, façonnée par ses créateurs
comme par ses joueurs. Lhistoire de Digital Extremes et de Warframe illustre quun projet né de
la nécessité peut devenir une référence, à condition dêtre animé par une vision forte et la
volonté de toujours se réinventer.
</p>
</div>
</article>
@@ -125,10 +178,10 @@
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Jérémy Hébert.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

View File

Before

Width:  |  Height:  |  Size: 24 KiB

After

Width:  |  Height:  |  Size: 24 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 942 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

Before

Width:  |  Height:  |  Size: 952 KiB

After

Width:  |  Height:  |  Size: 952 KiB

View File

Before

Width:  |  Height:  |  Size: 1002 KiB

After

Width:  |  Height:  |  Size: 1002 KiB

View File

Before

Width:  |  Height:  |  Size: 338 KiB

After

Width:  |  Height:  |  Size: 338 KiB

View File

Before

Width:  |  Height:  |  Size: 286 KiB

After

Width:  |  Height:  |  Size: 286 KiB

View File

Before

Width:  |  Height:  |  Size: 316 KiB

After

Width:  |  Height:  |  Size: 316 KiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

Before

Width:  |  Height:  |  Size: 1.2 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

Before

Width:  |  Height:  |  Size: 1.2 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

Before

Width:  |  Height:  |  Size: 692 KiB

After

Width:  |  Height:  |  Size: 692 KiB

View File

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

Before

Width:  |  Height:  |  Size: 1.6 MiB

After

Width:  |  Height:  |  Size: 1.6 MiB

View File

Before

Width:  |  Height:  |  Size: 391 KiB

After

Width:  |  Height:  |  Size: 391 KiB

View File

Before

Width:  |  Height:  |  Size: 770 KiB

After

Width:  |  Height:  |  Size: 770 KiB

View File

Before

Width:  |  Height:  |  Size: 333 KiB

After

Width:  |  Height:  |  Size: 333 KiB

View File

Before

Width:  |  Height:  |  Size: 409 KiB

After

Width:  |  Height:  |  Size: 409 KiB

View File

Before

Width:  |  Height:  |  Size: 1.5 MiB

After

Width:  |  Height:  |  Size: 1.5 MiB

View File

Before

Width:  |  Height:  |  Size: 233 KiB

After

Width:  |  Height:  |  Size: 233 KiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 586 KiB

View File

Before

Width:  |  Height:  |  Size: 1.2 MiB

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

Before

Width:  |  Height:  |  Size: 114 KiB

After

Width:  |  Height:  |  Size: 114 KiB

View File

Before

Width:  |  Height:  |  Size: 71 KiB

After

Width:  |  Height:  |  Size: 71 KiB

View File

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 1.4 MiB

View File

Before

Width:  |  Height:  |  Size: 1.3 MiB

After

Width:  |  Height:  |  Size: 1.3 MiB

View File

Before

Width:  |  Height:  |  Size: 266 KiB

After

Width:  |  Height:  |  Size: 266 KiB

View File

Before

Width:  |  Height:  |  Size: 688 KiB

After

Width:  |  Height:  |  Size: 688 KiB

View File

Before

Width:  |  Height:  |  Size: 1.5 MiB

After

Width:  |  Height:  |  Size: 1.5 MiB

View File

Before

Width:  |  Height:  |  Size: 77 KiB

After

Width:  |  Height:  |  Size: 77 KiB

View File

Before

Width:  |  Height:  |  Size: 1.4 MiB

After

Width:  |  Height:  |  Size: 1.4 MiB

View File

Before

Width:  |  Height:  |  Size: 876 KiB

After

Width:  |  Height:  |  Size: 876 KiB

View File

Before

Width:  |  Height:  |  Size: 1.9 MiB

After

Width:  |  Height:  |  Size: 1.9 MiB

View File

Before

Width:  |  Height:  |  Size: 2.1 MiB

After

Width:  |  Height:  |  Size: 2.1 MiB

View File

Before

Width:  |  Height:  |  Size: 973 KiB

After

Width:  |  Height:  |  Size: 973 KiB

View File

Before

Width:  |  Height:  |  Size: 1.0 MiB

After

Width:  |  Height:  |  Size: 1.0 MiB

View File

Before

Width:  |  Height:  |  Size: 94 KiB

After

Width:  |  Height:  |  Size: 94 KiB

View File

Before

Width:  |  Height:  |  Size: 1.0 MiB

After

Width:  |  Height:  |  Size: 1.0 MiB

View File

Before

Width:  |  Height:  |  Size: 177 KiB

After

Width:  |  Height:  |  Size: 177 KiB

View File

Before

Width:  |  Height:  |  Size: 107 KiB

After

Width:  |  Height:  |  Size: 107 KiB

View File

Before

Width:  |  Height:  |  Size: 281 KiB

After

Width:  |  Height:  |  Size: 281 KiB

View File

Before

Width:  |  Height:  |  Size: 35 KiB

After

Width:  |  Height:  |  Size: 35 KiB

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Les Alt-F4</title>
@@ -18,11 +18,12 @@
<body class="accueil">
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -34,7 +35,7 @@
<header>
<section>
<div id="texte">
<h1>WARFRAME : <br> Toute une histoire</h1>
<h1>WARFRAME: <br> Toute une histoire</h1>
<p> Warframe est un jeu daction coopératif free-to-play dans lequel vous incarnez un Tenno, un
guerrier
délite
@@ -46,9 +47,7 @@
évolution. Grâce à une grande liberté de personnalisation et à un contenu régulièrement enrichi,
Warframe offre une expérience profonde, fluide et accessible en équipe comme en solo.</p>
</div>
<video autoplay muted loop playsinline id="video">
<source src="medias/mediasLea/warframeIntro.mp4" type="video/mp4">
</video>
<video autoplay muted loop playsinline id="video" src="multimedia/mediasLea/warframeIntro.mp4">Balise vidéo non supportée</video>
</section>
</header>
@@ -63,7 +62,7 @@
<div>
<img src="images/imagesTeam/AvatarLea.png" alt="Avatar de Léa">
<p>Léa Dezothez</p>
<p>Directrice Artistique</p>
<p>Directrice artistique</p>
</div>
<div>
@@ -78,7 +77,7 @@
<p>Conseiller</p>
</div>
<a href="team.html">
<h2>Rencontrez l'équipe!</h2>
<p>Rencontrez l'équipe!</p>
</a>
</article>
</section>
@@ -86,21 +85,21 @@
<section> <!--Histoire de DE-->
<article id="histoireDE">
<div class="fondOpaqueGauche">
<h2>L'histoire de <br><em>Digital Extreme</em></h2>
<h2>Lhistoire de <br><em>Digital Extreme</em></h2>
<p>Fondé en 1993, Digital Extremes sest imposé comme un pionnier de lindustrie du jeu vidéo grâce
à des titres marquants allant de lancêtre « shareware » Epic Pinball à la série emblématique
Unreal (co-produite avec Epic Games), puis au succès mondial du jeu gratuit en ligne Warframe.
à des titres marquants allant de lancêtre «shareware» Epic Pinball à la série emblématique
Unreal (coproduite avec Epic Games), puis au succès mondial du jeu gratuit en ligne Warframe.
Avec plus de 30 ans dinnovation à son actif, le studio est reconnu non seulement pour la
qualité de ses jeux,
mais aussi pour sa culture interne forte : une équipe diversifiée comptant plus de 450 personnes
mais aussi pour sa culture interne forte: une équipe diversifiée comptant plus de 450 personnes
réparties au Canada et à linternational, un environnement de travail collaboratif, créatif et
engagé — et un profond attachement à la communauté de joueurs. Basé à Londres en Ontario,
engagé, ainsi quun profond attachement à la communauté de joueurs. Basé à Londres en Ontario,
Digital Extremes continue dinsuffler sa passion pour le développement et le partage, en gardant
comme moteur la créativité, lexcellence et lesprit communautaire.</p>
<!--Texte généré avec ChatGPT-->
<a href="histoire.html">PLUS D'INFOS</a>
<a href="histoire.html">PLUS DINFOS</a>
</div>
</article>
</section>
@@ -114,13 +113,13 @@
son histoire est devenue très complexe au cours des années.
Des évènements de communautés, des ajouts de mécaniques et de nouvelles zones ont enrichi le
narratif.
Toute ces informations prennent son sens en suivant les quêtes principales, qui racontent
Toutes ces informations prennent son sens en suivant les quêtes principales, qui racontent
lhistoire
du jeu.
Pour débloquer plus de quêtes dhistoire, il faut que le joueur progresse sur le système solaire
et
quil débloque des jonctions qui lient les planètes entre elles.</p>
<a href="lore.html">PLUS D'INFOS</a>
<a href="lore.html">PLUS DINFOS</a>
</div>
</article>
</section>
@@ -142,7 +141,7 @@
dadopter
des approches variées, de sadapter à différents styles de jeu et de tirer parti des capacités
uniques de chaque Warframe.</p>
<a href="missions.html">PLUS D'INFOS</a>
<a href="missions.html">PLUS DINFOS</a>
</div>
</article>
</section>
@@ -152,7 +151,7 @@
<div class="droite">
<h2>Les armures</h2>
<p>Les Warframes sont au cœur de lexpérience de Warframe : de puissantes armures biomécaniques
<p>Les Warframes sont au cœur de lexpérience de Warframe: de puissantes armures biomécaniques
dotées
de capacités uniques qui définissent entièrement le style de jeu du joueur. Chacune possède
quatre
@@ -166,18 +165,18 @@
peut être façonnée selon les préférences du joueur, faisant du choix et de loptimisation un
élément
clé de la progression.</p>
<a href="armures.html">PLUS D'INFOS</a>
<a href="armures.html">PLUS DINFOS</a>
</div>
</article>
</section>
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Page créée par Léa Dezothez.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Léa Dezothez.</p>
<a href="credits.html">Crédits</a>
</footer>
</body>
</html>

View File

@@ -1,123 +1,50 @@
/* AUTEUR: Stan
DATE : 2025-12-03
DESC: Ajout de glitch comme certains evenement dans Warframe
*/
// https://www.geeksforgeeks.org/html/difference-between-domcontentloaded-and-load-events/
// Performance for my useCase (modify NAV and FOOTER)
// https://stackoverflow.com/questions/44329324/cannot-read-property-symbolsymbol-iterator-of-undefined
/*
document.addEventListener("DOMContentLoaded",
function(e) {
console.log("DOMContentLoaded triggered !");
var topEl = document.getElementsByTagName("nav"); // maybe header
var listLI = topEl[0].getElementsByTagName("li");
// https://www.w3schools.com/js/js_timing.asp
// https://stackoverflow.com/questions/62039703/blur-an-image-with-javascript
function timerBlur() {
var count = 3;
var timer2 = setInterval(function () {
if (count == 3) {
document.getElementById('logoAccueil').style.filter = "blur(3px)";
document.getElementById("");
// var allA = listLI.getElementsByTagName("a");
// topEl.
}
else if (count == 2) {
document.getElementById('logoAccueil').style.filter = "blur(2px)";
}
else if (count == 1) {
document.getElementById('logoAccueil').style.filter = "blur(1px)";
}
else if (count == 0) {
document.getElementById('logoAccueil').style.filter = "";
clearInterval(timer2);
}
count--;
}, 350);
listLI.forEach(nodeLI => {console.log(nodeLI.innerHTML);});
*/
/*
allA.forEach(node => {
console.log(node);
});
*/
/*
// let myNav = document.getElementsByTagName("nav");
// myNav.getElementsByTagName("a")
for (child of allA){
console.log(child.innerHTML);
}
*/ // for (document.querySelector("nav")
// });
/*!SECTION
// .textContent
// .innerHTML
const parent = document.getElementById("myParent");
const children = parent.children;
for (let i = 0; i < children.length; i++) {
const child = children[i];
// Perform actions on the child element
console.log(child.textContent);
}
for (let i = 0; i < children.length; i++) {
const child = children[i];
// Perform actions on the child element
console.log(child.TagName);
console.log(child.textContent);…
*/
// javascript console output DOM tree
// https://stackoverflow.com/questions/50305257/how-to-console-log-entire-html-dom-tree-in-order-with-attribute-names
// https://developer.mozilla.org/en-US/docs/Web/API/TreeWalker
/*
var walker = document.createTreeWalker(
document.documentElement,
NodeFilter.SHOW_ELEMENT // only elements
);
while (walker.nextNode()) {
let current = walker.currentNode;
console.log(
current.tagName,
[...current.attributes].map(({value,name}) => `${name}=${value}`).join()
);
function timerGlitch() {
var timer = setInterval(function () {
curSrc = document.getElementById('logoAccueil').getAttribute('src');
if (curSrc == 'images/logoALT-F4_Nav.svg') {
timerBlur();
document.getElementById('logoAccueil').setAttribute('src', 'images/logoAlt-F4_NavGlitch.svg')
}
else {
document.getElementById('logoAccueil').setAttribute('src', 'images/logoALT-F4_Nav.svg')
}
}, 2500);
}
*/
// Needed for image loaded and fetched : Not on local computer.
/* https://www.geeksforgeeks.org/html/difference-between-domcontentloaded-and-load-events/
document.addEventListener("load", function(e) {
console.log("The page has completely loaded.");
});
*/
window.onload = function () {
setTimeout(function () {
/* document.getElementById('message').innerHTML =
'The page has finished loading! After 2 second'; */
// Check if on the test domain and that the text changed, if so display Data.
if (window.location.hostname === 's.zkd.ca' && document.getElementById("updateDate").innerHTML != 'DATE_WEBSITE' )
{
document.getElementById("updateDate").setAttribute("id", "updateDateV");
} else
{
document.getElementById("updateDate").setAttribute("id", "updateDateW");
document.getElementById("updateDateW").innerHTML = 'À la prochaine!';
}
// https://developer.mozilla.org/en-US/docs/Web/API/Element/children
// const myHeader = document.getElementByTagName("header"); // TODO: Make sure only first nav (need <header>)
myNav = document.getElementsByTagName("nav");
console.log(myNav.length());
for (var i = 0; i < myNav.children.length(); i++) {
var tableChild = myNav.children[i];
console.log(tableChild.tagName);
// Do stuff
}
/* for (const child of myNav.children) {
console.log(child.tagName);
}
*/
}, 2000);
// NOTE: Change Current Page based on url in <NAV>
// TODO Add timer for glitch
// NOTE Track mouse mouvement and show after a percentage of ?
// NOTE une page sur deux, ...
};
timerGlitch();
// NOTE: Change Current Page based on url in <NAV>
// NOTE Track mouse mouvement and show after a percentage of ?
// NOTE une page sur deux, ...
};

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Univers Sci-fi</title>
@@ -18,11 +18,12 @@
<body class="lore">
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html" class="active">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -35,27 +36,27 @@
<div>
<h1>Comment commence <em>Warframe</em>?</h1>
<p>Depuis lannée 2024, les nouveaux joueurs ont accès à deux débuts qui finissent par converger.
Le premier est celui qui est considéré <em>«Canon»</em> dans lunivers de Warframe tandis que le
<p>Depuis lannée 2024, les nouveaux joueurs ont accès à deux débuts qui finissent par converger.
Le premier est celui qui est considéré <em>«Canon»</em> dans lunivers de Warframe, tandis que le
deuxième
ressemble plus à un <em>Roguelike</em> pour rapidement introduire les joueurs au fonctionnement du
jeu.
Il ny a pas de conséquences à choisir le premier chemin, mais choisir le deuxième pour un nouveau
joueur pourrait être plus désorientant quautre chose même sil lintroduit tout de suite à toutes
les mécaniques importantes. <strong>Ces pages sur l'histoire inclue aussi ce deuxième chemin, mais
ne l'aborde que lorsqu'il arrive au moment important dans l'histoire principale.</strong></p>
joueur pourrait être plus désorientant quautre chose, même sil lintroduit tout de suite à toutes
les mécaniques importantes. <strong>Ces pages sur lhistoire incluent aussi ce deuxième chemin, mais
ne labordent que lorsquil arrive au moment important dans lhistoire principale.</strong></p>
<h3>Cliquez sur l'image pour sauter à la page concernant l'arc voulu!</h3>
<h3>Cliquez sur limage pour sauter à la page concernant larc voulu!</h3>
<table>
<tr>
<th>Arc 1: Éveil</th>
<th>Arc 2: Saga de la guerre intérieure</th>
<th>Arc 3: Saga de la nouvelle Guerre</th>
<th>Arc 4: Saga de la guerre du Néant</th>
<th>Arc 1 : Éveil</th>
<th>Arc 2 : Saga de la guerre intérieure</th>
<th>Arc 3 : Saga de la nouvelle Guerre</th>
<th>Arc 4 : Saga de la guerre du Néant</th>
</tr>
<tr>
<td><a href="sousPageLore1.html"><img src="images/ImagesLea/awakeningTableau.jpg"
alt="Trois tenno prennent la pose"></a></td>
alt="Trois Tenno prennent la pose"></a></td>
<td><a href="sousPageLore2.html"><img src="images/ImagesLea/warWithinTableau.jpg"
alt="Environnement de la forteresse Grineer"></a></td>
@@ -64,7 +65,7 @@
alt="Image du Sentient Natah"></a></td>
<td><a href="sousPageLore4.html"><img src="images/ImagesLea/voidWarTableau.jpg"
alt="Image de Rhino et Mag dos à dos"></a></td>
alt="Image de Rhino et Mag, dos à dos"></a></td>
</tr>
</table>
@@ -73,10 +74,10 @@
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Léa Dezothez.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@@ -10,7 +10,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Missions</title>
@@ -18,11 +18,12 @@
<body>
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe </a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html" class="active">Missions</a></li>
@@ -31,91 +32,138 @@
</nav>
<main class="missions">
<section>
<section id="missionsInfo">
<h1>Les missions</h1>
<p>Il existe plusieurs types de missions dans Warframe. Une des mécaniques du jeu fait qu'il est nécessaire
d'acquérir des resources. Les missions donnent la possibilité de les récolter. Nous vous présenterons
les
types de missions les plus fréquentes.</p>
<p>Il existe plusieurs types de missions dans Warframe. Une des mécaniques du jeu, les missions, est très
importante par le fait quelles nous permettent de récolter des ressources pour créer de meilleures
armes, armures et compagnons.
Les styles de missions présentées seront les plus communes et celles que le joueur rencontrera le plus
lors de lhistoire et de lexploration de la carte stellaire.</p>
</section>
<section>
<h2>Survival</h2>
<p>Les missions de survie sont a durée illimités, les joueurs reçoivent a chaque 5 minutes le choix de
continuer ou dévacuer. Ils reçoivent aussi une recompenses basée sur le niveau de la difficulté.
Lorsque les joueurs évacuent, ils n'ont pas besoin de se rendre a l'extraction contrairement aux autres
types de missions.</p>
<audio src="multimedia/we_All_Lift_Together_mPTCq3LiZSE.mp3" loop controls>Balise audio non
supportée</audio>
<section id="survie">
<article>
<h2>Survival</h2>
<p>Les missions de survie sont à durée illimitée, les joueurs reçoivent à chaque cinq minutes le choix
de
continuer ou dévacuer. Ils reçoivent aussi une récompense basée sur le niveau de la difficulté.
Lorsque les joueurs évacuent, ils nont pas besoin de se rendre à lextraction, contrairement aux
autres
types de missions.</p>
</article>
</section>
<section>
<h2>Assassination</h2>
<p>Les missions d'assassination présente une victime a localiser et éliminer, il n'y a que tres rarement
d'autre objectif. Ceci représente donc des missions rapidement completer.</p>
<section id="assassination">
<article>
<h2>Assassination</h2>
<p>Les missions dassassination présentent une victime à localiser et éliminer, il ny a que très
rarement
dautre objectif. Ceci représente donc des missions rapidement complétées.</p>
</article>
</section>
<section>
<h2>Capture</h2>
<p>Dans le meme style que les missions d'Assassination, il faut localiser la cible et la diminuer ses points
de vie avant de pouvoir la capturer</p>
<section id="capture">
<article>
<h2>Capture</h2>
<p>Dans le même style que les missions dAssassination, il faut localiser la cible et la diminuer ses
points
de vie avant de pouvoir la capturer</p>
</article>
</section>
<section>
<h2>Defense</h2>
<p>Une defense oblige les joueurs a protéger un objet sur la carte. Il y a généralement un bouclier pour
aider les joueurs et la mission peut être chronométré ou a plusieurs vague comme un missions de survie.
</p>
<section id="defense">
<article>
<h2>Défense</h2>
<p>Une défense oblige les joueurs à protéger un objet sur la carte. Il y a généralement un bouclier pour
aider les joueurs et la mission peut être chronométrée ou a plusieurs vagues, comme une mission de
survie.
</p>
</article>
</section>
<section>
<h2>Excavation</h2>
<p>Découlant un peu des missions de defenses, les joueurs doivent se rendre a un point d'excavation ou une
perceuse minière se doit dêtre alimenter en énergie et protéger le temps qu'elle fonctionne.</p>
<section id="excavation">
<article>
<h2>Excavation</h2>
<p>Découlant un peu des missions de défenses, les joueurs doivent se rendre à un point dexcavation ou
une
perceuse minière se doit dêtre alimentée en énergie et protéger le temps quelle fonctionne.</p>
</article>
</section>
<section>
<h2>Exterminate</h2>
<p>Généralement, pendant un conflit entre des factions du jeu, le joueur se doit de libérer l'espace du
conflit au detriment des factions présentes. Il y a un minimum d'ennemi a éliminer pour completer la
missions, ensuite le joueur peut explorer la carte ou se rendre a l'extraction.</p>
<section id="extermination">
<article>
<h2>Extermination</h2>
<p>Généralement, pendant un conflit entre des factions du jeu, le joueur se doit de libérer lespace du
conflit au détriment des factions présentes. Il y a un minimum dennemi à éliminer pour compléter la
mission, ensuite le joueur peut explorer la carte ou se rendre a lextraction.</p>
</article>
</section>
<section>
<h2>Hijack</h2>
<p>Une autre mission de defense, ou l'objet est un véhicule avançant lentement vers l'objectif, les joueurs
doivent défendre le véhicule. La mission est nommer hijack puisqu'il s'agit normalement d'un véhicule
appartenant a la faction de la carte.</p>
<section id="hijack">
<article>
<h2>Hijack</h2>
<p>Une autre mission de défense, où lobjet est un véhicule avançant lentement vers lobjectif, les
joueurs
doivent défendre le véhicule. La mission est nommée hijack, puisquil sagit normalement dun
véhicule
appartenant à la faction de la carte.</p>
</article>
</section>
<section>
<h2>Interception</h2>
<p>Une mission basée sur "Capture the Flag", les joueurs doivent capturer des zones et les controller le
plus longtemps possible. Il est possible de faire ce type de mission seul, si le joueur utilise un
Warframe avec une grande mobilité.</p>
<section id="interception">
<article>
<h2>Interception</h2>
<p>Une mission basée sur «Capture the Flag», les joueurs doivent capturer des zones et les contrôler le
plus longtemps possible. Il est possible de faire ce type de mission seul, si le joueur utilise un
Warframe avec une grande mobilité.</p>
</article>
</section>
<section>
<h2>Invasion</h2>
<p>Mission d'extermination contre une espèce alien mutante. ?????</p>
<section id="invasion">
<article>
<h2>Invasion</h2>
<p>Mission dextermination contre une espèce extraterrestre mutante. Deux factions sopposent pour le
contrôle dune planète, les joueurs choisissent leur camp!</p>
</article>
</section>
<section>
<h2>Mobile Defense</h2>
<p>Une mission ou nous devons déplacer un objet pour pirater des consoles, généralement trois consoles, et
le temps du piratage nous défendons le terminal pour pouvoir procéder ensuite au suivant.</p>
<section id="mobileDefense">
<article>
<h2>Mobile Défense</h2>
<p>Une mission où nous devons déplacer un objet pour pirater des consoles, généralement trois consoles,
et
le temps du piratage, nous défendons le terminal pour pouvoir procéder ensuite au suivant.</p>
</article>
</section>
<section>
<h2>Rescue</h2>
<p>L'objectif, ici, est de localiser un prisonnier dans une base, de le libérer, pour ensuite l'escorter
jusqu'a l'extraction</p>
<section id="sauvetage">
<article>
<h2>Rescue</h2>
<p>Lobjectif, ici, est de localiser un prisonnier dans une base, de le libérer, pour ensuite lescorter
jusquà lextraction</p>
</article>
</section>
<section>
<h2>Sabotage</h2>
<p>Mission ou les joueurs font exploser des réacteurs pour détruire une base ennemi.</p>
<section id="sabotage">
<article>
<h2>Sabotage</h2>
<p>Mission où les joueurs font exploser des réacteurs pour détruire une base ennemie.</p>
</article>
</section>
<section>
<h2>Autres missions</h2>
<p>Il existe encore bien plus de style de missions, je vous invite a jouer pour les découvrir.</p>
<p><a target="_blank" href="https://www.warframe.com/download">Page de téléchargement de Warframe</a></p>
<iframe title="steam" src="https://store.steampowered.com/widget/230410/" frameborder="0" width="646"
height="190"></iframe>
<section id="autreMissions">
<article>
<h2>Autres missions</h2>
<div class="sidebyside">
<div>
<p>Il existe encore bien plus de style de missions, je vous invite à jouer pour les découvrir.
</p>
<p><a target="_blank" href="https://www.warframe.com/download">Page de téléchargement de
Warframe</a>
</p>
</div>
<iframe title="steam" src="https://store.steampowered.com/widget/230410/" frameborder="0"
width="646" height="190"></iframe>
</div>
</article>
</section>
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Stanislas Royal.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@@ -11,7 +11,7 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Merci</title>
@@ -19,11 +19,12 @@
<body>
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -36,10 +37,10 @@
</main>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Jérémy Hébert.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

View File

@@ -11,19 +11,20 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/F4vicon.ico">
<link rel="icon" href="images/f4vicon.ico">
<link rel="stylesheet" href="css/style.css">
<script src="js/script.js"></script>
<title>Arc 1</title>
<title>Arc 1</title>
</head>
<body class="lore">
<nav>
<a href="index.html" class="boutonAccueil"><img src="images/LogoALT-F4_Nav.svg" alt="ALT-F4"></a>
<a href="index.html" class="boutonAccueil"><img src="images/logoALT-F4_Nav.svg" alt="ALT-F4"
id="logoAccueil"></a>
<ul>
<li><a href="aPropos.html">À propos</a></li>
<li><a href="team.html">L'équipe</a></li>
<li><a href="team.html">Léquipe</a></li>
<li><a href="histoire.html">Histoire de DE</a></li>
<li><a href="lore.html" class="active">Univers Sci-fi</a></li>
<li><a href="missions.html">Missions</a></li>
@@ -39,28 +40,29 @@
<th><a href="#professor">Le professeur</a></th>
<th><a href="#voxSolaris">Vox Solaris</a></th>
<th><a href="#onceAwake">Autrefois Éveillés</a></th>
<th><a href="#deimos">Coeur de Deimos</a></th>
<th><a href="#archwing">L'Archwing</a></th>
<th><a href="#deimos">Cœur de Deimos</a></th>
<th><a href="#archwing">LArchwing</a></th>
</tr>
</table>
<section>
<article id="awakening">
<div class="fondOpaqueGauche">
<h1>Arc 1: Éveil</h1>
<h1>Arc 1 : Éveil</h1>
<h2>Éveil</h2>
<p>
La première chose que les nouveaux joueurs voient est une cinématique poignante
sur la dévastation réalisée par lune des factions principales, les <em>Grineers</em>
(Gri-nirs).
Elle suit une femme qui fuit les grineers avec une narration en fond de la situation.
Le joueur apprend de linformation sur sa propre faction, les <em>Tennos</em> (Ten-noes)
Le joueur apprend de linformation sur sa propre faction, les <em>Tennos</em> (Ten-noes),
lorsque la femme arrive dans un temple où trois figures sont agenouillées. Elle pose une fleur
de
lotus devant chacune delle et après chaque fleur posée le joueur voit un <em>flash-back </em>de
lotus devant chacune delles et, après chaque fleur posée, le joueur voit un <em>flash-back
</em>de
la
personne agenouillée.
Après lintroduction, une voix féminine demande au joueur son premier choix : Celui de sa
Après lintroduction, une voix féminine demande au joueur son premier choix : celui de sa
<em>Warframe</em>.
</p>
<p>
@@ -69,7 +71,7 @@
se fait installer un <em>Ascaris</em> qui, après un certain temps, prend le contrôle de son
hôte.
Cet engin lui est posé par
un capitaine grineer du nom de <em>Vor</em>. Il dit quil offrira cette warframe à ses reines et
un capitaine grineer du nom de <em>Vor</em>. Il dit quil offrira cette Warframe à ses reines et
une
voix féminine
provoque une vague dénergie depuis notre <em>Warframe</em>. Le combat commence avec les bases
@@ -90,14 +92,13 @@
Dans le vaisseau, le Tenno fait la rencontre du <em>Cephalon</em> (Cé-pha-lon), une conscience
cristallisée
qui sert dunité de maintenance autonome du vaisseau. Ces entités sont des humains qui ont été
réduis à létat de
données et reprogrammé par une autre des faction nommée <em>Orokin</em> (Oro-kine).
Celui qui réside dans le vaisseau du Tenno sappelle <em>Ordis</em> et est considérée
défectueuse
réduits à létat de
données et reprogrammés par une autre des factions, nommée <em>Orokin</em> (Oro-kine).
Celui qui réside dans le vaisseau du Tenno sappelle <em>Ordis</em> et est considéré défectueux
par ses
nombreux glitch de personnalités pendant les dialogues ainsi que les dégâts subis par les tests
nombreux glitchs de personnalités pendant les dialogues ainsi que les dégâts subis par les tests
des
grineer.
grineers.
</p>
</div>
</article>
@@ -115,26 +116,26 @@
et
récupérer
les segments du vaisseau manquant. Ces successions de quêtes permettent de montrer au joueur
certains
certain
des types de missions les plus populaires ainsi que de linitier aux différentes options
daméliorations,
comme la fonderie pour créer des armes à partir de schémas ou la station de mod qui permet
daugmenter et changer
les statistiques de sa warframe et de ses armes. Une fois l<em>ascaris</em> enlevé, le
les statistiques de sa Warframe et de ses armes. Une fois l<em>ascaris</em> enlevé, le
Tenno
confronte Vor et son armée de
grineer. À laide dautres joueurs ou seul, un combat de boss appelé assassinat est
commencé.
Cest
un type de quête
répétitif qui peut donner en récompense des schémas pour dautres armes ou warframes. Une
répétitif qui peut donner en récompense des schémas pour dautres armes ou Warframes. Une
fois
la
mission terminée,
le Tenno intercepte un message de Vor à ses reines où il les avertit de la menace que le
Tenno
représente, mais que
le réveil abrupt a probablement endommagé ses souvenirs.
le réveil abrupt a probablement endommagée ses souvenirs.
</p>
</div>
</div>
@@ -147,9 +148,10 @@
<h2>Le Professeur</h2>
<p>
Une quête qui a été ajouté récemment introduit ensuite le Tenno plus en profondeur dans
Une quête qui a été ajoutée récemment introduit ensuite le Tenno plus en profondeur dans
lunivers
des mods et comment les utiliser pour rendre la warframe et ses armes plus puissantes. Cette
des mods. De plus, elle permet de comprendre comment les utiliser pour rendre la Warframe et ses
armes plus puissantes. Cette
quête
introduit aussi un personnage important qui sappelle <em>Teshin</em>(Tes-shine). Il est la
figure
@@ -159,10 +161,11 @@
qui se débloque uniquement une fois que le joueur a complété au moins une fois toutes les
missions
de la
carte solaire. Ce contenu est considéré comme de fin de jeu, pour plus de difficulté une fois
carte solaire. Ce contenu est considéré comme de fin de jeu, et permet davoir une plus grande
dose de difficulté une que fois
toutes
les missions
terminées.
sont terminées.
</p>
</div>
</article>
@@ -174,11 +177,11 @@
<div class="droite">
<h2>Vox Solaris</h2>
<blockquote>
<em>« Vous pouvez commencer cette Quête immédiatement après être entré à Fortuna :
<em>«Vous pouvez commencer cette Quête immédiatement après être entré à Fortuna :
une colonie sur Vénus habitée par des ouvriers endettés sous contrat, organisés sous le
nom
d'Union Solaris.
Parlez à leur contremaître, Eudico, pour commencer. Vous devrez l'aider, ainsi que les
dUnion Solaris.
Parlez à leur contremaître, Eudico, pour commencer. Vous devrez laider, ainsi que les
autres Solaris,
dans quelques tâches qui vous mèneront dans une zone extérieure gelée appelée la Vallée
Orbis.»</em>
@@ -190,10 +193,10 @@
<p> Cette colonie est sous le joug des <em>Corpus</em>(cor-puss), une faction gouvernée par le
profit.
Le contremaître de la zone, <em>Eudico</em>(yu-dit-co), a besoin daide. Il faut monter à la
surface de Vénus
appelé la Vallée Orbis. Elle a besoin que lon pille des caches corpus, retrouve les corps
surface de Vénus,
appelée la Vallée Orbis. Elle a besoin que lon pille des caches corpus, retrouve les corps
dagents disparus,
abattre des drones espions et extraire des matériaux. Cette quête introduit un moyen de
abattre des drones-espions et extraire des matériaux. Cette quête introduit un moyen de
transport appelé le
<em>K-drive</em>(Kay-drive), qui est un hoverboard. Après cette étape, le Tenno fait la
rencontre de Thursby
@@ -219,8 +222,8 @@
des vagues dennemis ainsi que des missions de type espionnage, où il faut sinfiltrer sans
activer les alarmes et récupérer des informations et ressources. Cette mission commence par
le
Lotus qui
nous envoi un courier via la messagerie du jeu avec en pièce jointe un fichier Grineer
Lotus, qui
nous envoie un courrier via la messagerie du jeu avec en pièce jointe un fichier Grineer
décodé
qui
mentionne une arme biologique. Le Tenno doit ensuite effectuer une mission despionnage pour
@@ -228,19 +231,20 @@
apprendre plus sur
cette arme. Après la deuxième pièce dinformation trouvée, le Tenno apprend la présence
dune
nouvelle faction ennemie appelé les Infestés. Cette faction attaque autant les Grineers que
nouvelle faction ennemie, appelée les Infestés. Cette faction attaque autant les Grineers
que
les
Tennos et
inflige du poison comme effet de statut. Une quête dextermination suit celle despionnage
pour
tuer le
plus dinfestés possible. Le Lotus propose ensuite dutiliser une bombe cascade pour
plus dinfestés possible. Le Lotus propose ensuite dutiliser une bombe en cascade pour
détruire
lorigine
des infestés. La proposition provoque une quête de type défense où il faut protéger la bombe
le
temps quelle
samorce. Malgré tout ses efforts, le Tenno narrive pas à éradiquer la présence des
samorce. Malgré tous ses efforts, le Tenno narrive pas à éradiquer la présence des
infestés
sur la carte solaire.
</p>
@@ -253,12 +257,12 @@
<article id="deimos">
<div class="fondOpaqueDroite">
<div class="droite">
<h2>Coeur de Deimos</h2>
<h2>Cœur de Deimos</h2>
<p>
Cette Quête commence avec le message d'un nouveau personnage mystérieux appelé Loid.
Cette Quête commence avec le message dun nouveau personnage mystérieux appelé Loid.
Le Cœur de Deimos présente un nouveau paysage ouvert, connu sous le nom de Puy de Cambion
ainsi qu'une zone sécurisée centrale appelée le Necralisk. Cette zone est la maison infestée
ainsi quune zone sécurisée centrale appelée le Necralisk. Cette zone est la maison infestée
dune faction appelée la famille Entrati. Une vieille famille Orokin qui a perdu leurs vrais
noms
ainsi que leur apparence humaine, ils ont été assimilés par linfestation de lastéroïde
@@ -269,7 +273,7 @@
exterminations de ruches infestées et la collecte de résidus brillants du Puy de Cambion.
Elle introduit aussi un twist à la pêche au harpon possible sur terre avec ses propres
harpons
qui peuvent percer la couche gélatineuse appelé exocrine qui sert de rivière à
qui peuvent percer la couche gélatineuse appelée exocrine, qui sert de rivière à
lenvironnement
infesté.
Lors de la mission dintroduction, le Tenno est aussi introduit au
@@ -279,14 +283,14 @@
faire
des
activités
variées dans le Puy de Cambion, dexploration libres à des primes offerte par le pnj appelé
variées dans le Puy de Cambion, dexploration libre à des primes offerte par le PNJ appelé
Mère.
Les divers
personnages de cette famille offrent tous différents schémas et ressources dans une
thématique.
Père
offre des
armes modulaires et les schémas pour créer la warframe Xaku, Fils offre au joueur de
armes modulaires et les schémas pour créer la Warframe Xaku, Fils offre au joueur de
revivifier
des
spécimens
@@ -305,28 +309,28 @@
<section>
<article id="archwing">
<div class="fondOpaqueGauche">
<h2>L'Archwing</h2>
<h2>LArchwing</h2>
<blockquote>
<em>« La récompense principale de cette Quête, l'Archwing, est une pièce d'équipement
Tenno essentielle qui permet à n'importe quelle Warframe de combattre et de voler dans
l'espace, ainsi que de nager rapidement sous l'eau. »</em>
<em>«La récompense principale de cette Quête, lArchwing, est une pièce déquipement
Tenno essentielle qui permet à nimporte quelle Warframe de combattre et de voler dans
lespace, ainsi que de nager rapidement sous leau.»</em>
<a href="https://www.warframe.com/fr/guides/quests/archwing" target="_blank">-Site officiel
Warframe</a>
</blockquote>
<p> La quête commence avec la menace dun officier Grineer qui rentre en possession
dun groupe de vaisseau appelé la flotte Fomorienne. Le conseiller Vay Hek déclare
dun groupe de vaisseaux appelé la flotte Fomorienne. Le conseiller Vay Hek déclare
la guerre aux corpus. Pour le stopper, le Tenno doit reconstruire des ailes mécaniques de
lère Orokin ainsi que ses armes de mêlée et de distance appelé <em>Archmelee</em> et
lère Orokin ainsi que ses armes de mêlée et de distance appelées <em>Archmelee</em> et
<em>Archgun</em>
(Arc-mêlée et Arc-gun). Ces ailes permettent au Tenno dengager en combat spatial la flotte.
Malgré le sabotage réussi, la flotte Fomorienne nest pas détruite et cette flotte devient un
évènement communautaire récurrent. Cet évènement se situe autour des relais Tenno où la flotte
tente de détruire la structure spatiale. Si lévènement se conclue par un échec, le relais
tente de détruire la structure spatiale. Si lévènement se conclut par un échec, le relais
explose
et il ne reste plus que des débris sur la carte et le relais devient inaccessible de manière
permanente.
Une fois cette mission complété, le Tenno peut créer un lanceur dArchwing quil peut utiliser
Une fois cette mission complétée, le Tenno peut créer un lanceur dArchwing quil peut utiliser
dans les
zones ouvertes de la Terre, de Vénus et de Deimos.
</p>
@@ -340,10 +344,10 @@
</aside>
<footer>
<p>Copyright © 2025 Les Alt-F4. Tout droits réservés.</p>
<p>Copyright © 2025 Les Alt-F4. Tous droits réservés.</p>
<p>Page créée par Léa Dezothez.</p>
<a href="credits.html">Crédits</a>
<p id="updateDate">DATE_WEBSITE</p>
</footer>
</body>

Some files were not shown because too many files have changed in this diff Show More