103 lines
4.4 KiB
HTML
103 lines
4.4 KiB
HTML
<!doctype html>
|
|
<html lang="fr">
|
|
<head>
|
|
<title>Quizz</title>
|
|
<meta charset="UTF-8" />
|
|
<link rel="stylesheet" href="/static/style.css" />
|
|
<script src="/static/js/utils.js" defer></script>
|
|
<link
|
|
rel="stylesheet"
|
|
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"
|
|
/>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="links">
|
|
<a href="/" class="header_button">Home Page</a>
|
|
<a href="/projects.html" class="header_button">Projets</a>
|
|
<a href="/about.html" class="header_button">A propos de moi</a>
|
|
<a href="/quizz" class="header_button">Vibe check</a>
|
|
<a href="https://djalim.fr" class="header_button">Blog Perso</a>
|
|
</div>
|
|
<button
|
|
id="display_header_links"
|
|
onclick="toggle_all_header_links()"
|
|
>
|
|
▼
|
|
</button>
|
|
</header>
|
|
|
|
<main>
|
|
<h1>Vibe Check</h1>
|
|
<form name="vibe" action="javascript:;" onsubmit="validate()">
|
|
<p>First you need to introduce yourself</p>
|
|
<label for="fname">First name:</label>
|
|
<input type="text" id="fname" name="fname" /><br />
|
|
<label for="lname">Last name:</label>
|
|
<input type="text" id="lname" name="lname" /><br />
|
|
<label for="birth">birthdate:</label>
|
|
<input type="text" id="birth" name="birth" /><br />
|
|
<label for="email">email:</label>
|
|
<input type="text" id="email" name="email" /><br />
|
|
<label for="phone">phone number:</label>
|
|
<input type="text" id="phone" name="phone" /><br />
|
|
<p>Now, answer thoses questions</p>
|
|
<label for="os-select">What's your os ?</label>
|
|
<select name="os-select" id="os-select">
|
|
<option value="linux">Linux based os</option>
|
|
<option value="windows">Windows</option>
|
|
<option value="macos">MacOs</option>
|
|
<option value="god's os">TempleOs</option>
|
|
<option value="tetrisos">TetrisOs</option>
|
|
</select>
|
|
<br />
|
|
<p>Who created Minecraft ?</p>
|
|
<input type="radio" id="db" name="mc_creator" value="db" />
|
|
<label for="db">DinnerBone</label><br />
|
|
<input type="radio" id="jeb" name="mc_creator" value="jeb" />
|
|
<label for="jeb">Jeb</label><br />
|
|
<input
|
|
type="radio"
|
|
id="notch"
|
|
name="mc_creator"
|
|
value="notch"
|
|
/>
|
|
<label for="notch">Notch</label><br />
|
|
<input type="radio" id="miku" name="mc_creator" value="miku" />
|
|
<label for="javascript">Hatsune Miku</label>
|
|
<br />
|
|
<br />
|
|
<label for="phone">What is the best vocaloid song</label><br />
|
|
<input type="text" id="voca" name="voca" /><br />
|
|
<label for="phone">What is your worth in euro</label><br />
|
|
<input type="number" id="worth" name="worth" />
|
|
<br /><br />
|
|
<a class="header_button" href="https://humainavendre.com/"
|
|
>Calculate it here</a
|
|
>
|
|
<br />
|
|
<label for="sns-select">Best social media app ?</label>
|
|
<select name="sns-select" id="sns-select">
|
|
<option value="Twitter">Twitter</option>
|
|
<option value="X">X</option>
|
|
<option value="Facebook">Facebook</option>
|
|
<option value="My Space">Myspace</option>
|
|
<option value="Club Pinguin">Club Pinguin</option>
|
|
<option value="TikTok">TikTok</option></select
|
|
><br />
|
|
<button type="submit" value="Submit">
|
|
Pass the vibe check
|
|
</button>
|
|
</form>
|
|
</main>
|
|
|
|
<footer>
|
|
<p>
|
|
Fait par Djalim Simaila et sa haine de l'HTML, CSS, mais pas du
|
|
JavaScript ♥️
|
|
</p>
|
|
<p>©2025</p>
|
|
</footer>
|
|
</body>
|
|
</html>
|