From 7cecbfe80e60bc22cab9f4c0e8e2aa0b33899280 Mon Sep 17 00:00:00 2001
From: Nicolai Ort <info@nicolai-ort.com>
Date: Wed, 19 Apr 2023 11:48:34 +0200
Subject: [PATCH] Register results

---
 src/routes/registration/+page.svelte | 44 ++++++++++++++++------------
 1 file changed, 25 insertions(+), 19 deletions(-)

diff --git a/src/routes/registration/+page.svelte b/src/routes/registration/+page.svelte
index 4db531c..012d96b 100644
--- a/src/routes/registration/+page.svelte
+++ b/src/routes/registration/+page.svelte
@@ -28,19 +28,19 @@
 
 	function textToBase64Barcode(text: string, is_qrcode: boolean) {
 		const canvas = document.createElement('canvas');
-		let bcid = 'ean13';
+		let bcid = 'code128';
 		if (is_qrcode) {
 			bcid = 'qrcode';
 		}
 		let codeconfig = {
 			bcid,
 			text: `${text}`,
-			scale: 4,
+			scale: 10,
 			includetext: true,
 			textxalign: 'center',
 			backgroundcolor: 'ffffff'
 		};
-		if (bcid == 'ean13') {
+		if (bcid == 'code128') {
 			codeconfig.height = 10;
 		}
 		bwipjs.toCanvas(canvas, codeconfig);
@@ -166,25 +166,31 @@
 						</form>
 						<!-- End Form -->
 					{:else}
-						<div>
-							<p class="text-lg mb-2 dark:text-white">ID: {response.id}</p>
-							<p class="text-lg mb-2 dark:text-white">Vorname: {response.firstname}</p>
-							<p class="text-lg mb-2 dark:text-white">Nachname: {response.lastname}</p>
+						<div class="mb-2">
+							<h3 class="text-xl font-semibold text-center dark:text-white">Läuferdaten</h3>
+							<p class="text-lg dark:text-white">ID: {response.id}</p>
+							<p class="text-lg dark:text-white">Vorname: {response.firstname}</p>
+							<p class="text-lg dark:text-white">Nachname: {response.lastname}</p>
 						</div>
 
-						<img
-							class="w-full md:w-auto mb-2 mx-auto"
-							alt="Runnerid"
-							src={textToBase64Barcode(response.id.toString(), false)}
-						/>
+						<div class="mb-2 text-center">
+							<h3 class="text-xl font-semibold dark:text-white">Läufercode</h3>
+							<img
+								class="w-full md:w-auto mb-2 mx-auto bg-white p-4"
+								alt="Runnerid"
+								src={textToBase64Barcode(response.id.toString(), false)}
+							/>
+						</div>
 
-						<button
-							on:click={() => {
-								showResult = false;
-							}}
-							class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800"
-							>Fertig</button
-						>
+						<div class="mx-auto text-center items-center">
+							<button
+								on:click={() => {
+									showResult = false;
+								}}
+								class="w-full py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold bg-blue-500 text-white hover:bg-blue-600 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800"
+								>Fertig</button
+							>
+						</div>
 					{/if}
 				</div>
 			</div>