lfk/kiosk
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request 'branding' (#1) from branding into main
All checks were successful
continuous-integration/drone/push Build is passing
Details

Browse Source 
Reviewed-on: #1
This commit is contained in:
Nicolai Ort 2023-04-19 10:49:18 +00:00
commit a07eb4ddf5
Signed by: git.odit.services
GPG Key ID: 76E155504123332E
6 changed files with 122 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -59,6 +59,7 @@
},
"type": "module",
"dependencies": {
"@fontsource/athiti": "^4.5.10",
"@odit/lfk-client-js": "1.0.1",
"bwip-js": "3.4.0"
},

3
pnpm-lock.yaml generated
View File

@ -1,6 +1,9 @@
lockfileVersion: '6.0'
dependencies:
'@fontsource/athiti':
specifier: ^4.5.10
version: 4.5.10
'@odit/lfk-client-js':
specifier: 1.0.1
version: 1.0.1

5
src/app.html
View File

@ -5,6 +5,11 @@
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width" />
%sveltekit.head%
<style>
body {
font-family: 'Athiti', sans-serif;
}
</style>
</head>
<body data-sveltekit-preload-data="hover">
<div style="display: contents">%sveltekit.body%</div>

2
src/routes/+layout.svelte
View File

@ -2,6 +2,7 @@
import { OpenAPI } from '@odit/lfk-client-js';
import { env } from '$env/dynamic/public';
import '../app.postcss';
import "@fontsource/athiti"
import Footer from '../components/footer.svelte';
OpenAPI.BASE = env.PUBLIC_BASE_URL || 'https://run.lauf-fuer-kaya.de';
@ -11,5 +12,4 @@
<main class="flex-grow">
<slot />
</main>
<Footer />
</div>

55
src/routes/registration/+page.svelte
View File

@ -1,6 +1,7 @@
<script lang="ts">
import { RunnerService, type ResponseRunner } from '@odit/lfk-client-js';
import bwipjs from 'bwip-js';
import lfkbackground from './background.png';
$: firstname = '';
$: lastname = '';
@ -47,31 +48,36 @@
}
</script>
<div class="dark:bg-slate-900 bg-gray-100 flex h-full items-center py-16">
<div class="w-full max-w-md mx-auto p-6">
<div
class="mt-7 bg-white border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-700"
class="dark:bg-slate-900 bg-gray-100 flex h-full items-center py-16"
style="background: url({lfkbackground});background-position: center center!important;background-size: contain!important;background-repeat: no-repeat!important;"
>
<div class="w-full max-w-md mx-auto p-6">
<!-- <div
class="mt-7 bg-white border border-gray-200 rounded-xl shadow-sm dark:bg-gray-800 dark:border-gray-700"
> -->
<div class="p-4 sm:p-7">
<div class="mt-5">
<!-- Form -->
{#if !showResult}
<div class="text-center">
<h1 class="block text-2xl font-bold text-gray-800 dark:text-white">Registrierung</h1>
<p class="mt-2 text-sm text-gray-600 dark:text-gray-400">Melde dich für den LfK an</p>
<h1 class="block text-7xl font-bold text-gray-800 dark:text-white">LfK!2023</h1>
<h1 class="block text-4xl font-bold text-gray-800 dark:text-white">Registrierung</h1>
<!-- <p class="mt-2 text-sm text-gray-600 dark:text-gray-400">Melde dich für den LfK an</p> -->
</div>
<form on:submit|preventDefault={register}>
<form class="mt-4 text-lg" on:submit|preventDefault={register}>
<div class="grid gap-y-4">
<!-- Form Group -->
<div>
<label for="firstname" class="block text-sm mb-2 dark:text-white">Vorname</label>
<label for="firstname" class="block text-lg font-bold mb-2 sr-only">Vorname</label>
<div class="relative">
<input
type="text"
id="firstname"
name="firstname"
class="py-3 px-4 block w-full border-gray-200 rounded-md text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 border"
class="py-3 px-4 block w-full border-gray-200 rounded-md focus:border-blue-500 focus:ring-blue-500 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 border"
required
placeholder="Vorname"
bind:value={firstname}
aria-describedby="firstname-error"
/>
@ -105,14 +111,15 @@
<!-- Form Group -->
<div>
<label for="lastname" class="block text-sm mb-2 dark:text-white">Nachname</label>
<label for="lastname" class="block text-lg font-bold mb-2 sr-only">Nachname</label>
<div class="relative">
<input
type="lastname"
id="lastname"
name="lastname"
class="py-3 px-4 block w-full border-gray-200 rounded-md text-sm focus:border-blue-500 focus:ring-blue-500 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 border"
class="py-3 px-4 block w-full border-gray-200 rounded-md focus:border-blue-500 focus:ring-blue-500 dark:bg-gray-800 dark:border-gray-700 dark:text-gray-400 border"
required
placeholder="Nachname"
aria-describedby="lastname-error"
bind:value={lastname}
/>
@ -147,7 +154,7 @@
<button
type="submit"
disabled={!firstname || !lastname}
class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold disabled:opacity-70 bg-blue-600 text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all text-sm dark:focus:ring-offset-gray-800"
class="py-3 px-4 inline-flex justify-center items-center gap-2 rounded-md border border-transparent font-semibold disabled:opacity-70 bg-blue-600 text-white hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-all dark:focus:ring-offset-gray-800"
>Anmelden</button
>
</div>
@ -155,7 +162,7 @@
<!-- End Form -->
{:else}
<div class="mb-2 text-center">
<h3 class="text-2xl font-semibold dark:text-white">
<h3 class="text-4xl font-semibold dark:text-white">
{response.firstname}
{response.lastname}
</h3>
@ -180,7 +187,31 @@
</div>
{/if}
</div>
<!-- </div> -->
</div>
</div>
</div>
<div class="fixed bottom-0 w-full text-center text-xl p-4">
<a
rel="noopener noreferrer"
target="_blank"
href="https://lauf-fuer-kaya.de/datenschutz/"
class="underline">Datenschutzerklärung</a
>
|
<a
rel="noopener noreferrer"
target="_blank"
href="https://lauf-fuer-kaya.de/impressum/"
class="underline">Impressum</a
>
<br />
<br />
<b class="font-bold">LfK!2023</b> powered by
<a
rel="noopener noreferrer"
target="_blank"
href="https://odit.services?ref=lfk"
class="underline">ODIT.Services</a
>
</div>

BIN
src/routes/registration/background.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 36 KiB