dan/Portfolio
1
0
Fork 0
mirror of https://github.com/danbulant/Portfolio synced 2026-05-24 12:35:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: init code modal

Browse source
This commit is contained in:
EETagent 2022-11-17 23:11:52 +01:00
parent a1a5e45643
commit 1e1f0802e9
2 changed files with 34 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
frontend/src/lib/assets/woman.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 42 KiB

39
frontend/src/routes/login/[code=application]/+page.svelte
View file

@ -1,13 +1,42 @@
<script lang="ts">
import FullLayout from '$lib/components/layout/FullLayout.svelte';
import woman from '$lib/assets/woman.png';
</script>
<FullLayout />
<FullLayout>
<div class="modal">
<img class="mx-auto" src={woman} alt="" />
<div class="flex justify-center items-center">
{#each [1, 2, 3, 4] as value}
<input
class="mr-2 text-center text-4xl font-semibold text-sspsBlue bg-[#f8fafb] w-16 h-20 shadow-lg p-3 rounded-xl outline-none border transition-colors duration-300 hover:border-sspsBlue border-2"
type="text"
{value}
/>
{/each}
<span class="mr-2 w-8 h-2 bg-sspsBlue"></span>
{#each [5, 6, 7, 8] as value}
<input
class="mr-2 text-center text-4xl font-semibold text-sspsBlue bg-[#f8fafb] w-16 h-20 shadow-lg p-3 rounded-xl outline-none border transition-colors duration-300 hover:border-sspsBlue border-2"
type="text"
{value}
/>
{/each}
</div>
<h3 class="mt-6 text-sspsBlue font-semibold text-xl text-center">
Zadejte 8místný kód pro aktivaci účtu
</h3>
<p class="text-sspsGray text-center">Nevíte si rady? Klikněte <u>zde</u></p>
</div>
</FullLayout>
<style>
.form {
@apply flex flex-col;
@apply mx-auto w-[90%] h-full;
@apply items-center justify-center;
.modal {
@apply flex flex-col items-center justify-center;
@apply mx-auto my-auto;
@apply w-3/5 h-3/5;
@apply rounded-3xl;
@apply bg-white;
}
</style>