projet-clicodrome2.0/index.html
2025-01-17 13:46:22 +01:00

143 lines
5.2 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ProgWeb-Legends</title>
<link rel="stylesheet" href="" id="link-css">
<link rel="stylesheet" href="./css/index.css">
<link rel="stylesheet" href="./css/alerte/a1.css" id="alerte-css">
<link rel="icon" type="image/x-icon" href="./img/favicon.ico">
</head>
<body>
<script src="./js/intro.js" defer></script>
<script src="./js/technologie.js"></script>
<script src="./js/main.js" defer></script>
<script src="./js/alerte.js"></script>
<script src="./js/collegue.js"></script>
<!-- Contenu principal -->
<main>
<!-- Section Confettis -->
<section id="confetti-section">
<div id="confetti-container"></div>
</section>
<!-- Section Score -->
<section id="score-section">
<div id="score_button" class="score-button">
<div id="div_score" class="div-centrer-contenu"></div>
<div id="div_button" class="bouton-score div-centrer-contenu">
<button id="bouton-prof" onclick="leBoostDuProf()">Le Méga Boost du Prof</button>
</div>
</div>
</section>
<!-- Section technologies -->
<section id="technologies-section">
<h2>Magasin des technologies</h2>
<table id="table_magasin_technologies" class="table-magasin">
<thead id="table_magasin_technologies_head">
<tr>
<th>Nom</th>
<th>Revenu/click</th>
<th>Coût</th>
</tr>
</thead>
<tbody id="table_magasin_technologies_body"></tbody>
</table>
</section>
<!-- Section collegues -->
<section id="collegues-section">
<h2>Magasin des collègues</h2>
<table id="table_magasin_collegues">
<thead>
<tr>
<th>Nom</th>
<th>Revenu passif</th>
<th>Coût</th>
<th>Lien</th>
</tr>
</thead>
<tbody id="table_magasin_collegues_body"></tbody>
</table>
</section>
<!-- Section Image animée -->
<section id="image-collegue-section" class="div-centrer-contenu">
<img id="image_collegue_animee" alt="Image d'un collègue animé" hidden>
</section>
<!-- Section Vidéo -->
<section id="video-section" class="div-centrer-contenu">
<video controls id="never" hidden></video>
<button id="close_rick" type="button" hidden>X</button>
</section>
<!-- Section Alertes -->
<section id="alerte-section">
<div id="alerte_jolie" class="modal div-centrer-contenu">
<div class="modal-content">
<span class="close-btn" onclick="fermerAlerte()">&times;</span>
<p id="message_alerte_jolie"></p>
<div class="div-centrer-contenu">
<input type="text" id="input_alerte_jolie">
<button class="bouton-ok" onclick="fermerAlerte()">OK</button>
</div>
</div>
</div>
</section>
<!-- Section Publicités -->
<section id="ad-section">
<!--Pubs années 2000-->
<section id="ad-vieux" class="ad-vieux">
<img src="./img/miaou1.jpeg" alt="Chat" class="adt2">
<img src="./img/GIF-CHATON.gif" alt="Chat" class="adt3">
</section>
<!-- Pubs modernes Gauche -->
<div class="ad-moderne-left">
<section id="ad-section-left" class="ad-moderne">
<div class="ad-container">
<img src="./img/shrek3.webp" alt="Pub Shrek 3">
</div>
<div class="ad-container">
<img src="./img/shrek4.jpg" alt="Pub Shrek 4">
</div>
</section>
</div>
<!-- Pubs modernes Droite -->
<div class="ad-moderne-right">
<section id="ad-section-right" class="ad-moderne">
<div class="ad-container">
<img src="./img/shrek.webp" alt="Pub Shrek 1">
</div>
<div class="ad-container">
<img src="./img/shrek2.jpg" alt="Pub Shrek 2">
</div>
</section>
</div>
</section>
<!-- Section Cadeau -->
<section id="cadeau-section">
<div id="div_cadeau">
<img id="img_cadeau" src="img/cadeau.png" alt="Image de cadeau">
</div>
</section>
</main>
<!-- Pied de page -->
<footer>
<p>L'évolution est non contractuelle, adaptée pour le gameplay</p>
</footer>
</body>
</html>