qr-codes/index.html at main · Basty7/qr-codes · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
<!DOCTYPE html>
<html lang="fr">

<head>
	<title>Les codes QR</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<link rel="stylesheet" type="text/css" href="style.css">
	<script src="index.js" defer></script>
	<script src="qrcode.min.js"></script>
	<link rel="shortcut icon" href="assets/favicon.svg" type="image/x-icon">
	<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
</head>

<body id="index">
	<nav>
		<p id="index" class="navlist material-symbols-outlined" title="Retour à l'acceuil">home</p>
		<p class="navlist" id="histoire">L'histoire du Code QR</p>
		<p class="navlist" id="principe">Le fonctionnement du Code QR</p>
		<p class="navlist" id="uses">Les fonctions du Code QR</p>
		<p class="navlist" id="gen">Générateur avancé</p>
	</nav>
	<h1 class="titre" title="Retour en haut de la page">Les Codes QR</h1>

	<p>Nous utilisons les Codes QR au quotidien, mais connaissez-vous leur histoire, comment ils fonctionnent et l'étendu de ce qu'on peut faire avec ?<br>Je vais essayer de répondre à toutes ces questions <i>via</i> ce site.</p>
	<p>Pour commencer il faut savoir ce que signifie l'abréviation <span class="red">"Code QR"</span>: ce nom nous vient de l'anglais. <span class = "red">QR</span> signifiant <span class="red">"Quick-response"</span> Code QR signifie donc <span class="red">"Code à réponse rapide"</span> !</p>
	<section>
		<h2>Générateur de QR Code</h2>
		<p>Ce Générateur est assez sommaire et ne permet pour l'instant de ne générer que des codes QR menant à une adresse internet. (Cliquez dessus pour télecharger)</p>
		<div class="indexgen">
			<input type="url" id='link' placeholder="https://example.com" pattern="https://*.*" required class="link-bt"></input>
			<button onclick="clear_box('link');" title="Vider le champ" class="link-bt">X</button>
			<button id="url_gen">Générer</button>
			<br><br>
			<a id="qrcode" download="QRCode"></a>
		</div>
	</section>
		<footer>
			<p class="sources">Sources:</p>
			<a href="https://en.wikipedia.org/wiki/QR_code" class="sources" title="Pas mal d'infos" target="_blank">Wikipedia - Codes QR - en</a>
			<a href="https://fr.wikipedia.org/wiki/Code_QR" class="sources" title="Pas mal d'infos aussi" target="_blank">Wikipedia - Codes QR - fr</a>
			<a href="https://en.wikipedia.org/wiki/VCard" class="sources" title="Les informations pour générer les cartes de Contact" target="_blank">Wikipedia - vCard - en</a>
			<a href="https://github.com/zhiyuan-l/qrcodejs" class="sources" title="La libraire qui permet de générer les codes QR" target="_blank">qrcodejs</a>
		</footer>
</body>
</html>