Final html template

apps/member/templates/member/qr_code.html

@@ -5,7 +5,32 @@ SPDX-License-Identifier: GPL-3.0-or-later
 {% load i18n %}
 
 {% block content %}
+<div class="card bg-light">
+  	<h3 class="card-header text-center">
+		{% trans "QR Code for" %} {{ user_object.username }} ({{ user_object.first_name }} {{user_object.last_name }})
+  	</h3>
+  	<div class="text-center" id="qrcode">
+  	</div>
+</div>
 
-Affichage du QR Code ici
 
 {% endblock %}
+
+{% block extrajavascript %}
+<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js" integrity="sha512-CNgIRecGo7nphbeZ04Sc13ka07paqdeTu0WR1IM4kNcpmBAUSHSQX0FslNhTDadL4O5SAGapGt4FodqL8My0mA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+<script>
+	var qrc = new QRCode(document.getElementById("qrcode"), {
+		text: "{{ user_object.pk }}",
+		width: 1024,
+		height: 1024
+	});
+</script>
+{% endblock %}
+
+{% block extracss %}
+<style>
+img {
+    width: 100%
+}
+</style>
+{% endblock %}