From 1312c390b0451d184a9a85608a7d9bded33572c5 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 14:46:06 +0100
Subject: [PATCH 1/8] fix: remove homepage

---
 frontend/src/routes/+page.svelte | 2 --
 1 file changed, 2 deletions(-)
 delete mode 100644 frontend/src/routes/+page.svelte

diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
deleted file mode 100644
index 65e4bbb..0000000
--- a/frontend/src/routes/+page.svelte
+++ /dev/null
@@ -1,2 +0,0 @@
-<h1 class="text-6xl">Welcome to SvelteKit</h1>
-<p>Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation</p>

From b7079812a9a53c95204306d8f6b8ebcdedca72c6 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 14:46:38 +0100
Subject: [PATCH 2/8] fix: expose port 8000

---
 Dockerfile | 1 +
 1 file changed, 1 insertion(+)

diff --git a/Dockerfile b/Dockerfile
index a2c4656..3629242 100644
--- a/Dockerfile
+++ b/Dockerfile
@@ -10,4 +10,5 @@ COPY --from=builder /portfolio/target/release/portfolio /usr/local/bin/portfolio
 VOLUME ["/portfolio"]
 WORKDIR /portfolio
 
+EXPOSE 8000
 ENTRYPOINT ["portfolio"]

From 56f53983459b4cd7ec27662b3844c5916a1e454d Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 14:56:09 +0100
Subject: [PATCH 3/8] fix: better input width

---
 frontend/src/routes/(admin)/admin/auth/login/+page.svelte | 4 ++--
 frontend/src/routes/(candidate)/auth/login/+page.svelte   | 7 ++++---
 2 files changed, 6 insertions(+), 5 deletions(-)

diff --git a/frontend/src/routes/(admin)/admin/auth/login/+page.svelte b/frontend/src/routes/(admin)/admin/auth/login/+page.svelte
index a2140cc..bd30265 100644
--- a/frontend/src/routes/(admin)/admin/auth/login/+page.svelte
+++ b/frontend/src/routes/(admin)/admin/auth/login/+page.svelte
@@ -34,7 +34,7 @@
 		<p class="text-sspsGray mt-8 text-center font-light">
 			Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br /> Fusce suscipit libero eget elit.
 		</p>
-		<div class="mt-8 flex w-3/5 flex-col">
+		<div class="mt-8 flex w-4/5 lg:w-3/5 flex-col">
 			<span>
 				<TextField bind:value={adminIdValue} placeholder="Admin id" type="number" />
 			</span>
@@ -42,7 +42,7 @@
 				<PasswordField bind:value={adminPasswordValue} placeholder="Heslo" />
 			</span>
 		</div>
-		<div class="mt-8  w-3/5">
+		<div class="mt-8 w-4/5 lg:w-3/5">
 			<Submit value="Odeslat" on:click={login} />
 		</div>
 	</div>
diff --git a/frontend/src/routes/(candidate)/auth/login/+page.svelte b/frontend/src/routes/(candidate)/auth/login/+page.svelte
index adef62a..cff8cc5 100644
--- a/frontend/src/routes/(candidate)/auth/login/+page.svelte
+++ b/frontend/src/routes/(candidate)/auth/login/+page.svelte
@@ -21,12 +21,13 @@
 		<SchoolBadge />
 		<h1 class="text-sspsBlue mt-8 text-4xl font-semibold">Přihlášení</h1>
 		<p class="text-sspsGray my-8 text-center font-light">
-			Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br /> Fusce suscipit libero eget elit.
+			Evidenční číslo je jedinečné číslo přidělené uchazeči, které slouží k jeho identifikaci<br /> a
+			přihlášení se do systému.
 		</p>
-		<div class="w-3/5">
+		<div class="w-4/5 lg:w-3/5">
 			<TextField bind:value={applicationValue} placeholder="Ev. číslo" type="number" />
 		</div>
-		<div class="mt-8 w-3/5">
+		<div class="mt-8 w-4/5 lg:w-3/5">
 			<Submit on:click={redirectToCode} value="Odeslat" />
 		</div>
 	</div>

From bd075c8d5fadfce6f02158a41d3dfad36d211760 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 14:56:18 +0100
Subject: [PATCH 4/8] fix: full page on mobile

---
 frontend/src/lib/components/layout/SplitLayout.svelte         | 3 +--
 .../(candidate)/auth/login/[code=application]/+page.svelte    | 4 ++--
 2 files changed, 3 insertions(+), 4 deletions(-)

diff --git a/frontend/src/lib/components/layout/SplitLayout.svelte b/frontend/src/lib/components/layout/SplitLayout.svelte
index 8251601..d40970f 100644
--- a/frontend/src/lib/components/layout/SplitLayout.svelte
+++ b/frontend/src/lib/components/layout/SplitLayout.svelte
@@ -49,8 +49,7 @@
 	}
 	.view {
 		@apply z-10 overflow-scroll;
-		@apply rounded-3xl md:rounded-none;
-		@apply absolute top-0 right-0 bottom-0 left-0 m-auto h-[90vh] w-[90vw] md:top-auto md:bottom-auto md:left-auto md:m-0;
+		@apply absolute top-0 right-0 bottom-0 left-0 m-auto md:top-auto md:bottom-auto md:left-auto md:m-0;
 		@apply md:h-screen md:w-[50vw];
 		@apply md:my-auto;
 		@apply bg-white;
diff --git a/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte b/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte
index c77aa78..cbaa92a 100644
--- a/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte
+++ b/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte
@@ -123,8 +123,8 @@
 	.modal {
 		@apply flex flex-col items-center justify-center;
 		@apply mx-auto my-auto;
-		@apply h-[90vh] w-[90vw] md:h-4/5 md:w-4/5;
-		@apply rounded-3xl;
+		@apply h-full w-full md:h-4/5 md:w-4/5;
+		@apply md:rounded-3xl;
 		@apply bg-white;
 	}
 	input {

From 095f354fe1031b5b9733ac05f8423a2fc4e20292 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 14:58:24 +0100
Subject: [PATCH 5/8] fix: reset error

---
 .../src/lib/components/admin/modal/CreateCandidateModal.svelte   | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte b/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte
index 6a71d92..5b7ebe8 100644
--- a/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte
+++ b/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte
@@ -26,6 +26,7 @@
 		try {
 			login = await apiCreateCandidate(data);
 			dispatch('created');
+			error = '';
 		} catch (e: unknown) {
 			console.error(e);
 			error = (e as ApiError).msg;

From e512a6c2efcd273bd89a97eb9f096c26452779cf Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 15:02:58 +0100
Subject: [PATCH 6/8] fix: correct width for register form

---
 .../routes/(candidate)/(authenticated)/register/+page.svelte    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte b/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
index 7ea2f83..a6bdfb0 100644
--- a/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
+++ b/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
@@ -594,7 +594,7 @@
 
 <style lang="postcss">
 	.field {
-		@apply mt-4 md:mt-8 w-full;
+		@apply mt-4 md:mt-8 w-full lg:w-4/5 lg:mx-auto;
 	}
 	.form {
 		@apply flex flex-col;

From ff7374accc536d156877f88c0f58d1fa1de4a7d1 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 15:09:48 +0100
Subject: [PATCH 7/8] fix: register mobile view fixes

---
 .../routes/(candidate)/(authenticated)/register/+page.svelte  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte b/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
index a6bdfb0..7341973 100644
--- a/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
+++ b/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
@@ -332,8 +332,8 @@
 
 <SplitLayout>
 	<div class="form relative">
-		<div class="overflow-scroll h-[65%] md:h-auto absolute bottom-3/12 flex flex-col w-full">
-			<div class="h-32 w-32 <md:hidden self-center mb-4">
+		<div class="overflow-scroll md:h-auto absolute bottom-3/12 flex flex-col w-full">
+			<div class="h-32 w-32 <md:h-24 <md:w-24 self-center mb-4">
 				<SchoolBadge />
 			</div>
 		<form on:submit={handleSubmit} id="triggerForm" class="invisible hidden"></form>

From f2d5c13fa62b1a3a17edd92124954ea4f808f035 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 3 Jan 2023 15:11:21 +0100
Subject: [PATCH 8/8] refactor: reformat whole frontend

---
 frontend/src/global.d.ts                      |  40 +-
 frontend/src/lib/@api/admin.ts                |   4 +-
 .../admin/modal/CreateCandidateModal.svelte   |   5 +-
 .../dashboard/DashboardInfoCard.svelte        |  72 ++-
 .../dashboard/DashboardUploadCard.svelte      |   1 -
 .../components/dashboard/InfoButton.svelte    |  17 +-
 frontend/src/lib/stores/candidate.ts          |   2 +-
 .../(authenticated)/dashboard/+page.svelte    |  12 +-
 .../(admin)/admin/auth/login/+page.svelte     |   2 +-
 .../(authenticated)/+layout.server.ts         |   2 +-
 .../(authenticated)/dashboard/+page.svelte    |   2 +-
 .../(authenticated)/register/+page.server.ts  |   4 +-
 .../(authenticated)/register/+page.svelte     | 491 +++++++++---------
 .../login/[code=application]/+page.svelte     |   2 +-
 14 files changed, 360 insertions(+), 296 deletions(-)

diff --git a/frontend/src/global.d.ts b/frontend/src/global.d.ts
index cc4837b..e2ae676 100644
--- a/frontend/src/global.d.ts
+++ b/frontend/src/global.d.ts
@@ -1,18 +1,24 @@
-declare type FileDropEvent = import("filedrop-svelte/event").FileDropEvent;
-declare type FileDropSelectEvent = import("filedrop-svelte/event").FileDropSelectEvent;
-declare type FileDropDragEvent = import("filedrop-svelte/event").FileDropDragEvent;
+declare type FileDropEvent = import('filedrop-svelte/event').FileDropEvent;
+declare type FileDropSelectEvent = import('filedrop-svelte/event').FileDropSelectEvent;
+declare type FileDropDragEvent = import('filedrop-svelte/event').FileDropDragEvent;
 declare namespace svelte.JSX {
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    interface HTMLAttributes<T> {
-        onfiledrop?: (event: CustomEvent<FileDropSelectEvent> & { target: EventTarget & T }) => void;
-        onfiledragenter?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
-        onfiledragleave?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
-        onfiledragover?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
-        onfiledialogcancel?: (event: CustomEvent<FileDropEvent> & { target: EventTarget & T }) => void;
-        onfiledialogclose?: (event: CustomEvent<FileDropEvent> & { target: EventTarget & T }) => void;
-        onfiledialogopen?: (event: CustomEvent<FileDropEvent> & { target: EventTarget & T }) => void;
-        onwindowfiledragenter?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
-        onwindowfiledragleave?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
-        onwindowfiledragover?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
-    }
-}
\ No newline at end of file
+	// eslint-disable-next-line @typescript-eslint/no-unused-vars
+	interface HTMLAttributes<T> {
+		onfiledrop?: (event: CustomEvent<FileDropSelectEvent> & { target: EventTarget & T }) => void;
+		onfiledragenter?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
+		onfiledragleave?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
+		onfiledragover?: (event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }) => void;
+		onfiledialogcancel?: (event: CustomEvent<FileDropEvent> & { target: EventTarget & T }) => void;
+		onfiledialogclose?: (event: CustomEvent<FileDropEvent> & { target: EventTarget & T }) => void;
+		onfiledialogopen?: (event: CustomEvent<FileDropEvent> & { target: EventTarget & T }) => void;
+		onwindowfiledragenter?: (
+			event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }
+		) => void;
+		onwindowfiledragleave?: (
+			event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }
+		) => void;
+		onwindowfiledragover?: (
+			event: CustomEvent<FileDropDragEvent> & { target: EventTarget & T }
+		) => void;
+	}
+}
diff --git a/frontend/src/lib/@api/admin.ts b/frontend/src/lib/@api/admin.ts
index fcbf2f7..6c9d64c 100644
--- a/frontend/src/lib/@api/admin.ts
+++ b/frontend/src/lib/@api/admin.ts
@@ -123,9 +123,7 @@ export const apiFetchCandidate = async (id: number, fetchSsr?: Fetch): Promise<C
 
 // SSR compatible
 // List all candidates /admin/list/candidates
-export const apiListCandidatesCSV = async (
-	fetchSsr?: Fetch,
-): Promise<Blob> => {
+export const apiListCandidatesCSV = async (fetchSsr?: Fetch): Promise<Blob> => {
 	const apiFetch = fetchSsr || fetch;
 	try {
 		const res = await apiFetch(API_URL + '/admin/list/candidates_csv', {
diff --git a/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte b/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte
index 5b7ebe8..c6df9dc 100644
--- a/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte
+++ b/frontend/src/lib/components/admin/modal/CreateCandidateModal.svelte
@@ -48,7 +48,10 @@
 			{:else}
 				<h1 class="text-sspsBlue text-3xl font-semibold">Registrace nového uchazeče</h1>
 				{#if error}
-					<div class="my-2 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" role="alert">
+					<div
+						class="relative my-2 rounded border border-red-400 bg-red-100 px-4 py-3 text-red-700"
+						role="alert"
+					>
 						<span class="block sm:inline">{error}</span>
 					</div>
 				{/if}
diff --git a/frontend/src/lib/components/dashboard/DashboardInfoCard.svelte b/frontend/src/lib/components/dashboard/DashboardInfoCard.svelte
index 8bdc33d..be69728 100644
--- a/frontend/src/lib/components/dashboard/DashboardInfoCard.svelte
+++ b/frontend/src/lib/components/dashboard/DashboardInfoCard.svelte
@@ -1,13 +1,18 @@
 <script lang="ts">
 	import debounce from 'just-debounce-it';
 
-	import { apiDeltePortfolio, apiGetPortfolio, apiLogout, apiSubmitPortfolio } from '$lib/@api/candidate';
+	import {
+		apiDeltePortfolio,
+		apiGetPortfolio,
+		apiLogout,
+		apiSubmitPortfolio
+	} from '$lib/@api/candidate';
 	import Circles from '$lib/components/icons/Circles.svelte';
 	import { fetchSubmProgress, type Status } from '$lib/stores/portfolio';
 	import StatusNotificationBig from './StatusNotificationBig.svelte';
 	import InfoButton from './InfoButton.svelte';
 	import { baseCandidateData, candidateData } from '$lib/stores/candidate';
-	import tippy, {sticky} from 'tippy.js';
+	import tippy, { sticky } from 'tippy.js';
 	import { goto } from '$app/navigation';
 
 	export let title: string;
@@ -61,19 +66,19 @@
 	};
 
 	const editDetails = async () => {
-		goto('/register?edit=true')
-	}
+		goto('/register?edit=true');
+	};
 
 	const logout = async () => {
 		await apiLogout();
-		goto("/auth/login");
-	}
+		goto('/auth/login');
+	};
 </script>
 
 <div class="card flex flex-col">
 	<div class="infoBar <2xl:flex-col flex flex-row-reverse">
 		<StatusNotificationBig {loading} {status} on:click={debounce(handleNotificationClick, 150)} />
-		<div class="mr-4 <2xl:mr-1">
+		<div class="<2xl:mr-1 mr-4">
 			<div on:click on:keydown class="flex flex-col">
 				<div class="<2xl:ml-auto <2xl:flex-row <2xl:my-2 flex flex-col">
 					<InfoButton
@@ -89,7 +94,7 @@
 	<div class="relative my-2 flex flex-col overflow-hidden">
 		<div>
 			<div class="mt-[5%] flex flex-col">
-				<div class="flex justify-between"> 
+				<div class="flex justify-between">
 					<h3>{title}</h3>
 					<span
 						on:click={logout}
@@ -101,15 +106,28 @@
 							sticky: true,
 							plugins: [sticky]
 						}}
-						class="<2xl:hidden hover:cursor-pointer">
-						<svg class="w-10 h-10 stroke-sspsBlueDark" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"></path></svg>
+						class="<2xl:hidden hover:cursor-pointer"
+					>
+						<svg
+							class="stroke-sspsBlueDark h-10 w-10"
+							fill="none"
+							stroke="currentColor"
+							viewBox="0 0 24 24"
+							xmlns="http://www.w3.org/2000/svg"
+							><path
+								stroke-linecap="round"
+								stroke-linejoin="round"
+								stroke-width="2"
+								d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
+							/></svg
+						>
 					</span>
 				</div>
 				<slot />
 			</div>
 		</div>
 		{#if showDetails}
-			<div class="overflow-scroll flex justify-between">
+			<div class="flex justify-between overflow-scroll">
 				<div>
 					<div
 						use:tippy={{
@@ -121,7 +139,10 @@
 						}}
 						class="mt-4 flex flex-col justify-between leading-10"
 					>
-						<span>Ev. č. přihlášky: <span class="font-bold">{$baseCandidateData.applicationId}</span></span>
+						<span
+							>Ev. č. přihlášky: <span class="font-bold">{$baseCandidateData.applicationId}</span
+							></span
+						>
 						<span>Obor: <span class="font-bold">{$candidateData.candidate.study}</span></span>
 						<span>Adresa: <span class="font-bold">{$candidateData.candidate.address}</span></span>
 						<span
@@ -133,10 +154,12 @@
 							></span
 						>
 						<span
-							>Rodné číslo: <span class="font-bold">{$candidateData.candidate.personalIdNumber}</span
+							>Rodné číslo: <span class="font-bold"
+								>{$candidateData.candidate.personalIdNumber}</span
 							></span
 						>
-						<span>Telefon: <span class="font-bold">{$candidateData.candidate.telephone}</span></span>
+						<span>Telefon: <span class="font-bold">{$candidateData.candidate.telephone}</span></span
+						>
 					</div>
 					<div
 						use:tippy={{
@@ -167,8 +190,23 @@
 						sticky: true,
 						plugins: [sticky]
 					}}
-				 	on:click={(_) => editDetails()} on:keydown={(_) => editDetails()} class="mt-4 hover:cursor-pointer">
-					<svg class="w-10 h-10 stroke-sspsBlue" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"></path></svg>
+					on:click={(_) => editDetails()}
+					on:keydown={(_) => editDetails()}
+					class="mt-4 hover:cursor-pointer"
+				>
+					<svg
+						class="stroke-sspsBlue h-10 w-10"
+						fill="none"
+						stroke="currentColor"
+						viewBox="0 0 24 24"
+						xmlns="http://www.w3.org/2000/svg"
+						><path
+							stroke-linecap="round"
+							stroke-linejoin="round"
+							stroke-width="2"
+							d="M11 5H6a2 2 0 00-2 2v11a2 2 0 002 2h11a2 2 0 002-2v-5m-1.414-9.414a2 2 0 112.828 2.828L11.828 15H9v-2.828l8.586-8.586z"
+						/></svg
+					>
 				</span>
 			</div>
 		{/if}
@@ -182,7 +220,7 @@
 
 		@apply bg-[#f8fbfc];
 		@apply rounded-3xl;
-		@apply px-7 py-10 <2xl:px-5 <2xl:py-5;
+		@apply <2xl:px-5 <2xl:py-5 px-7 py-10;
 
 		@apply transition-all duration-300;
 	}
diff --git a/frontend/src/lib/components/dashboard/DashboardUploadCard.svelte b/frontend/src/lib/components/dashboard/DashboardUploadCard.svelte
index d7cb132..1e73712 100644
--- a/frontend/src/lib/components/dashboard/DashboardUploadCard.svelte
+++ b/frontend/src/lib/components/dashboard/DashboardUploadCard.svelte
@@ -68,7 +68,6 @@
 		clearInterval(dashAnimationInterval);
 	};
 
-
 	const onFileDrop = (dropped: Files) => {
 		console.log(dropped);
 		if (dropped.accepted.length > 0) {
diff --git a/frontend/src/lib/components/dashboard/InfoButton.svelte b/frontend/src/lib/components/dashboard/InfoButton.svelte
index f889613..77d8533 100644
--- a/frontend/src/lib/components/dashboard/InfoButton.svelte
+++ b/frontend/src/lib/components/dashboard/InfoButton.svelte
@@ -88,8 +88,21 @@
 	}}
 	on:click={(_) => logout()}
 	on:keydown={(_) => logout()}
-	class="icon logoutIcon ml-1 hover:cursor-pointer">
-	<svg class="w-10 h-10 icon logoutIcon" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"></path></svg>
+	class="icon logoutIcon ml-1 hover:cursor-pointer"
+>
+	<svg
+		class="icon logoutIcon h-10 w-10"
+		fill="none"
+		stroke="currentColor"
+		viewBox="0 0 24 24"
+		xmlns="http://www.w3.org/2000/svg"
+		><path
+			stroke-linecap="round"
+			stroke-linejoin="round"
+			stroke-width="2"
+			d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"
+		/></svg
+	>
 </span>
 
 <style lang="postcss">
diff --git a/frontend/src/lib/stores/candidate.ts b/frontend/src/lib/stores/candidate.ts
index 8b18f82..5e9dc7a 100644
--- a/frontend/src/lib/stores/candidate.ts
+++ b/frontend/src/lib/stores/candidate.ts
@@ -43,7 +43,7 @@ export interface CreateCandidateLogin extends CreateCandidate {
 	password: string;
 }
 
-export const baseCandidateData= writable<CreateCandidate>({
+export const baseCandidateData = writable<CreateCandidate>({
 	applicationId: 0,
 	personalIdNumber: ''
 });
diff --git a/frontend/src/routes/(admin)/admin/(authenticated)/dashboard/+page.svelte b/frontend/src/routes/(admin)/admin/(authenticated)/dashboard/+page.svelte
index 1f57692..fcbaf01 100644
--- a/frontend/src/routes/(admin)/admin/(authenticated)/dashboard/+page.svelte
+++ b/frontend/src/routes/(admin)/admin/(authenticated)/dashboard/+page.svelte
@@ -8,7 +8,7 @@
 	import type { PageServerData } from './$types';
 	import Table from '$lib/components/admin/table/Table.svelte';
 
-	import bacgkround from "$lib/assets/background.jpg";
+	import bacgkround from '$lib/assets/background.jpg';
 
 	export let data: PageServerData;
 
@@ -87,7 +87,7 @@
 		} catch (e) {
 			console.log(e);
 		}
-	}
+	};
 </script>
 
 {#if createCandidateModal}
@@ -98,8 +98,8 @@
 {/if}
 
 <div>
-	<header class="w-full h-14">
-		<img class="h-12 w-full object-cover filter blur-sm" src={bacgkround} alt="Background">
+	<header class="h-14 w-full">
+		<img class="h-12 w-full object-cover blur-sm filter" src={bacgkround} alt="Background" />
 	</header>
 	<div class="flex flex-row">
 		<div class="list fixed">
@@ -116,12 +116,12 @@
 				<TextField on:keyup={search} bind:value={searchValue} placeholder="Hledat" />
 				<button
 					on:click={openCreateCandidateModal}
-					class="bg-gray-500 hover:bg-gray-600 ml-3 w-2/5 rounded-lg p-3 py-4 text-xl font-semibold text-white transition-colors duration-300"
+					class="ml-3 w-2/5 rounded-lg bg-gray-500 p-3 py-4 text-xl font-semibold text-white transition-colors duration-300 hover:bg-gray-600"
 					>Nový uchazeč</button
 				>
 				<button
 					on:click={downloadCSV}
-					class="bg-gray-500 hover:bg-gray-600 ml-3 w-2/5 rounded-lg p-3 py-4 text-xl font-semibold text-white transition-colors duration-300"
+					class="ml-3 w-2/5 rounded-lg bg-gray-500 p-3 py-4 text-xl font-semibold text-white transition-colors duration-300 hover:bg-gray-600"
 					>CSV</button
 				>
 			</div>
diff --git a/frontend/src/routes/(admin)/admin/auth/login/+page.svelte b/frontend/src/routes/(admin)/admin/auth/login/+page.svelte
index bd30265..60b612c 100644
--- a/frontend/src/routes/(admin)/admin/auth/login/+page.svelte
+++ b/frontend/src/routes/(admin)/admin/auth/login/+page.svelte
@@ -34,7 +34,7 @@
 		<p class="text-sspsGray mt-8 text-center font-light">
 			Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br /> Fusce suscipit libero eget elit.
 		</p>
-		<div class="mt-8 flex w-4/5 lg:w-3/5 flex-col">
+		<div class="mt-8 flex w-4/5 flex-col lg:w-3/5">
 			<span>
 				<TextField bind:value={adminIdValue} placeholder="Admin id" type="number" />
 			</span>
diff --git a/frontend/src/routes/(candidate)/(authenticated)/+layout.server.ts b/frontend/src/routes/(candidate)/(authenticated)/+layout.server.ts
index cd4cb60..e6f1f41 100644
--- a/frontend/src/routes/(candidate)/(authenticated)/+layout.server.ts
+++ b/frontend/src/routes/(candidate)/(authenticated)/+layout.server.ts
@@ -12,7 +12,7 @@ export const load: LayoutServerLoad = async ({ cookies, fetch }) => {
 		});
 		return {
 			whoami: whoami
-		}
+		};
 	} else {
 		throw redirect(302, '/auth/logout');
 	}
diff --git a/frontend/src/routes/(candidate)/(authenticated)/dashboard/+page.svelte b/frontend/src/routes/(candidate)/(authenticated)/dashboard/+page.svelte
index 37a184d..efa51b0 100644
--- a/frontend/src/routes/(candidate)/(authenticated)/dashboard/+page.svelte
+++ b/frontend/src/routes/(candidate)/(authenticated)/dashboard/+page.svelte
@@ -82,7 +82,7 @@
 		{/each}
 	</div>
 	<div class="dashboard dashboardMobile">
-		<div class="name md:my-10 mx-auto w-[90%]">
+		<div class="name mx-auto w-[90%] md:my-10">
 			<DashboardInfoCard
 				status={getUploadStatus($submissionProgress.status)}
 				title={$candidateData.candidate.name + ' ' + $candidateData.candidate.surname ?? ''}
diff --git a/frontend/src/routes/(candidate)/(authenticated)/register/+page.server.ts b/frontend/src/routes/(candidate)/(authenticated)/register/+page.server.ts
index 6e591f8..e52e0d4 100644
--- a/frontend/src/routes/(candidate)/(authenticated)/register/+page.server.ts
+++ b/frontend/src/routes/(candidate)/(authenticated)/register/+page.server.ts
@@ -5,10 +5,10 @@ import type { PageServerLoad } from './$types';
 export const load: PageServerLoad = async ({ fetch }) => {
 	const details: CandidateData | undefined = await apiFetchDetails(fetch).catch((e) => {
 		console.error(e);
-        return undefined;
+		return undefined;
 	});
 
 	return {
-		candidate: details,
+		candidate: details
 	};
 };
diff --git a/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte b/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
index 7341973..ef774c1 100644
--- a/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
+++ b/frontend/src/routes/(candidate)/(authenticated)/register/+page.svelte
@@ -35,7 +35,6 @@
 	export let data: PageData;
 	let details = data.candidate;
 
-
 	const formInitialValues = {
 		gdpr: false,
 		candidate: {
@@ -140,11 +139,10 @@
 	// TODO: validate on admin dashboard, move somewhere
 	// TODO: nefunguje pro lidi nar. pred 1.1.1954 :D
 	const isPersonalIdNumberValid = (personalIdNumber: string): boolean => {
-		const idFmt = personalIdNumber
-			.split('/')
-			.join('');
+		const idFmt = personalIdNumber.split('/').join('');
 
-		const lastDigitCheck = Number(idFmt.slice(0, 9)) % 11 === Number(idFmt.at(-1)) || 
+		const lastDigitCheck =
+			Number(idFmt.slice(0, 9)) % 11 === Number(idFmt.at(-1)) ||
 			Number(idFmt.slice(0, 9)) % 11 === 10; // an edge case that could occur
 		const divisibleBy11 = Number(idFmt) % 11 === 0;
 
@@ -153,26 +151,30 @@
 		} else {
 			return false;
 		}
-	}
+	};
 
-	const isPersonalIdNumberWithBirthdateValid = (personalIdNumber: string, birthdate: string): boolean => {
+	const isPersonalIdNumberWithBirthdateValid = (
+		personalIdNumber: string,
+		birthdate: string
+	): boolean => {
 		const dateFmt = birthdate
 			.split('.')
-			.map((x) => x.padStart(2, '0')) 
+			.map((x) => x.padStart(2, '0'))
 			.reverse()
 			.join('')
 			.slice(2);
-		const idFmt = personalIdNumber
-			.split('/')
-			.join('');
+		const idFmt = personalIdNumber.split('/').join('');
 
 		const divisionValid = isPersonalIdNumberValid(personalIdNumber);
 
 		const idMonth = Number(idFmt.slice(2, 4));
 		const dateMonth = Number(dateFmt.slice(2, 4));
-		const monthValid = idMonth === dateMonth || idMonth === dateMonth + 50 || 
-			idMonth === dateMonth + 20 || idMonth === dateMonth + 70;
-		
+		const monthValid =
+			idMonth === dateMonth ||
+			idMonth === dateMonth + 50 ||
+			idMonth === dateMonth + 20 ||
+			idMonth === dateMonth + 70;
+
 		if (
 			idFmt.slice(0, 2) === dateFmt.slice(0, 2) &&
 			monthValid &&
@@ -183,7 +185,6 @@
 		} else {
 			return false;
 		}
-	
 	};
 
 	const onSubmit = async (values: CandidateData) => {
@@ -192,7 +193,12 @@
 			let oldValues = JSON.parse(JSON.stringify(values));
 			try {
 				if (values.candidate.citizenship === 'Česká republika') {
-					if (!isPersonalIdNumberWithBirthdateValid(values.candidate.personalIdNumber, values.candidate.birthdate)) {
+					if (
+						!isPersonalIdNumberWithBirthdateValid(
+							values.candidate.personalIdNumber,
+							values.candidate.birthdate
+						)
+					) {
 						alert('Rodné číslo neodpovídá oficiální specifikaci či datumu narození'); // TODO: alerts
 						throw new Error('Rodné číslo neodpovídá datumu narození');
 					}
@@ -212,7 +218,6 @@
 					(x) => x.name !== '' && x.surname !== '' && x.email !== '' && x.telephone !== ''
 				);
 
-
 				await apiFillDetails(values);
 				goto('/dashboard');
 			} catch (e) {
@@ -220,7 +225,7 @@
 				console.error('error while submitting data: ' + e);
 			}
 		}
-	}
+	};
 
 	const { form, errors, handleSubmit, handleChange } = createForm({
 		initialValues: formInitialValues,
@@ -292,267 +297,269 @@
 	};
 
 	const formatTelephone = (telephone: string) => {
-		return '+' + telephone
-			.match(/[0-9]{1,3}/g)!
-			.join(' ');
-	}
-	
+		return '+' + telephone.match(/[0-9]{1,3}/g)!.join(' ');
+	};
+
 	if (details !== undefined) {
-		details.candidate.birthdate = details.candidate.birthdate
-			.split('-')
-			.reverse()
-			.join('.');
-			
-			details.candidate.telephone = formatTelephone(details.candidate.telephone);
-			details.parents.map((x) => x.telephone = x.telephone != '' ? formatTelephone(x.telephone) : '');
-			form.set({
-				gdpr: true,
-				candidate: {
-					...details.candidate
-				},
-				parents: [
+		details.candidate.birthdate = details.candidate.birthdate.split('-').reverse().join('.');
+
+		details.candidate.telephone = formatTelephone(details.candidate.telephone);
+		details.parents.map(
+			(x) => (x.telephone = x.telephone != '' ? formatTelephone(x.telephone) : '')
+		);
+		form.set({
+			gdpr: true,
+			candidate: {
+				...details.candidate
+			},
+			parents: [
 				{
 					...details.parents[0]
 				},
 				{
-					...details.parents[1] ?? {
+					...(details.parents[1] ?? {
 						name: '',
 						surname: '',
 						email: '',
 						telephone: ''
-					}
+					})
 				}
 			]
 		});
-		pageIndex = 1; // skip gdpr page	
-		pageTexts[1] = 'Úprava osobních údajů'
+		pageIndex = 1; // skip gdpr page
+		pageTexts[1] = 'Úprava osobních údajů';
 	}
-
 </script>
 
 <SplitLayout>
 	<div class="form relative">
-		<div class="overflow-scroll md:h-auto absolute bottom-3/12 flex flex-col w-full">
-			<div class="h-32 w-32 <md:h-24 <md:w-24 self-center mb-4">
+		<div class="bottom-3/12 absolute flex w-full flex-col overflow-scroll md:h-auto">
+			<div class="<md:h-24 <md:w-24 mb-4 h-32 w-32 self-center">
 				<SchoolBadge />
 			</div>
-		<form on:submit={handleSubmit} id="triggerForm" class="invisible hidden"></form>
-		{#if pageIndex === 0}
-			<form on:submit={handleSubmit}>
-				<h1 class="title mt-8">{pageTexts[0]}</h1>
+			<form on:submit={handleSubmit} id="triggerForm" class="invisible hidden" />
+			{#if pageIndex === 0}
+				<form on:submit={handleSubmit}>
+					<h1 class="title mt-8">{pageTexts[0]}</h1>
+					<p class="description mt-8 block text-center">
+						V rámci portálu pro přijímací řízení zpracováváme mnoho osobních údajů. Proto je nutný
+						Váš souhlas s jejich zpracováním. O bezpečnosti zpracování Vašich osobních údajů si
+						můžete přečíst
+						<a href="/bezpecnost" class="text-sspsBlue underline"> zde</a>.
+					</p>
+					<div class="field">
+						<GdprCheckBox
+							on:change={handleChange}
+							bind:value={$form.gdpr}
+							error={$typedErrors['gdpr']}
+						/>
+					</div>
+				</form>
+			{:else if pageIndex === 1}
+				<form on:submit={handleSubmit}>
+					<h1 class="title mt-8">{pageTexts[1]}</h1>
+					<p class="description mt-8 block text-center">
+						V rámci usnadnění přijímacího řízení jsme připravili online formulář, který Vám pomůže s
+						vyplněním potřebných údajů.
+					</p>
+					<div class="flex flex-col">
+						<span class="field">
+							<NameField
+								error={$typedErrors['candidate']['name'] || $typedErrors['candidate']['surname']}
+								on:change={handleChange}
+								bind:valueName={$form.candidate.name}
+								bind:valueSurname={$form.candidate.surname}
+								placeholder="Jméno a příjmení"
+							/>
+						</span>
+						<span class="field">
+							<EmailField
+								error={$typedErrors['candidate']['email']}
+								on:change={handleChange}
+								bind:value={$form.candidate.email}
+								placeholder="E-mail"
+							/>
+						</span>
+						<span class="field">
+							<TelephoneField
+								error={$typedErrors['candidate']['telephone']}
+								on:change={handleChange}
+								bind:value={$form.candidate.telephone}
+								placeholder="Telefon"
+							/>
+						</span>
+					</div>
+				</form>
+			{:else if pageIndex === 2}
+				<h1 class="title mt-8">{pageTexts[2]}</h1>
 				<p class="description mt-8 block text-center">
-					V rámci portálu pro přijímací řízení zpracováváme mnoho osobních údajů. Proto je nutný Váš
-					souhlas s jejich zpracováním. O bezpečnosti zpracování Vašich osobních údajů si můžete přečíst
-					<a href="/bezpecnost" class="text-sspsBlue underline"> zde</a>.
+					Pro registraci je potřeba vyplnit několik údajů o Vás. Tyto údaje budou použity pro
+					přijímací řízení. Všechny údaje jsou důležité.
 				</p>
-				<div class="field">
-					<GdprCheckBox
-						on:change={handleChange}
-						bind:value={$form.gdpr}
-						error={$typedErrors['gdpr']}
-					/>
+				<div class="flex w-full flex-col">
+					<span class="field">
+						<TextField
+							error={$typedErrors['candidate']['address']}
+							on:change={handleChange}
+							bind:value={$form.candidate.address}
+							type="text"
+							placeholder="Adresa trvalého bydliště"
+							helperText="Uveďte ulici, č.p., město, PSČ"
+						/>
+					</span>
+					<span class="field">
+						<TextField
+							error={$typedErrors['candidate']['birthplace']}
+							on:change={handleChange}
+							bind:value={$form.candidate.birthplace}
+							type="text"
+							placeholder="Místo narození"
+							helperText="Uveďte město"
+							icon
+						>
+							<div slot="icon" class="text-sspsBlue flex items-center justify-center">
+								<Home />
+							</div>
+						</TextField>
+					</span>
 				</div>
-			</form>
-		{:else if pageIndex === 1}
-			<form on:submit={handleSubmit}>
-				<h1 class="title mt-8">{pageTexts[1]}</h1>
+
+				<div class="field flex items-center">
+					<TextField
+						error={$typedErrors['candidate']['birthdate']}
+						on:change={handleChange}
+						bind:value={$form.candidate.birthdate}
+						type="text"
+						placeholder="Datum narození"
+						helperText="TODO: (Uveďte ve formátu DD.MM.RRRR)"
+					/>
+					<div class="ml-2">
+						<SelectField
+							error={$typedErrors['candidate']['sex']}
+							on:change={handleChange}
+							bind:value={$form.candidate.sex}
+							options={['Žena', 'Muž']}
+							placeholder="Pohlaví"
+						/>
+					</div>
+				</div>
+			{:else if pageIndex === 3}
+				<h1 class="title mt-8">{pageTexts[3]}</h1>
 				<p class="description mt-8 block text-center">
-					V rámci usnadnění přijímacího řízení jsme připravili online formulář, který Vám pomůže s
-					vyplněním potřebných údajů.
+					Sběr dat o zákonném zástupci je klíčový pro získání důležitých kontaktů a informací.
 				</p>
-				<div class="flex flex-col">
+				<div class="flex w-full flex-col">
 					<span class="field">
 						<NameField
-							error={$typedErrors['candidate']['name'] || $typedErrors['candidate']['surname']}
+							error={$typedErrors['parents'][0]['name'] || $typedErrors['parents'][0]['surname']}
 							on:change={handleChange}
-							bind:valueName={$form.candidate.name}
-							bind:valueSurname={$form.candidate.surname}
-							placeholder="Jméno a příjmení"
+							bind:valueName={$form.parents[0].name}
+							bind:valueSurname={$form.parents[0].surname}
+							placeholder="Jméno a příjmení zákonného zástupce"
 						/>
 					</span>
 					<span class="field">
 						<EmailField
-							error={$typedErrors['candidate']['email']}
+							error={$typedErrors['parents'][0]['email']}
 							on:change={handleChange}
-							bind:value={$form.candidate.email}
-							placeholder="E-mail"
+							bind:value={$form.parents[0].email}
+							placeholder="E-mail zákonného zástupce"
 						/>
 					</span>
 					<span class="field">
 						<TelephoneField
-							error={$typedErrors['candidate']['telephone']}
+							error={$typedErrors['parents'][0]['telephone']}
 							on:change={handleChange}
-							bind:value={$form.candidate.telephone}
-							placeholder="Telefon"
+							bind:value={$form.parents[0].telephone}
+							placeholder="Telefon zákonného zástupce"
 						/>
 					</span>
 				</div>
-			</form>
-		{:else if pageIndex === 2}
-			<h1 class="title mt-8">{pageTexts[2]}</h1>
-			<p class="description mt-8 block text-center">
-				Pro registraci je potřeba vyplnit několik údajů o Vás. Tyto údaje budou použity pro
-				přijímací řízení. Všechny údaje jsou důležité.
-			</p>
-			<div class="flex w-full flex-col">
-				<span class="field">
-					<TextField
-						error={$typedErrors['candidate']['address']}
-						on:change={handleChange}
-						bind:value={$form.candidate.address}
-						type="text"
-						placeholder="Adresa trvalého bydliště"
-						helperText="Uveďte ulici, č.p., město, PSČ"
-					/>
-				</span>
-				<span class="field">
-					<TextField
-						error={$typedErrors['candidate']['birthplace']}
-						on:change={handleChange}
-						bind:value={$form.candidate.birthplace}
-						type="text"
-						placeholder="Místo narození"
-						helperText="Uveďte město"
-						icon
-					>
-						<div slot="icon" class="text-sspsBlue flex items-center justify-center">
-							<Home />
-						</div>
-					</TextField>
-				</span>
-			</div>
-
-			<div class="field flex items-center">
-				<TextField
-					error={$typedErrors['candidate']['birthdate']}
-					on:change={handleChange}
-					bind:value={$form.candidate.birthdate}
-					type="text"
-					placeholder="Datum narození"
-					helperText="TODO: (Uveďte ve formátu DD.MM.RRRR)"
-				/>
-				<div class="ml-2">
-					<SelectField
-						error={$typedErrors['candidate']['sex']}
-						on:change={handleChange}
-						bind:value={$form.candidate.sex}
-						options={['Žena', 'Muž']}
-						placeholder="Pohlaví"
-					/>
-				</div>
-			</div>
-		{:else if pageIndex === 3}
-			<h1 class="title mt-8">{pageTexts[3]}</h1>
-			<p class="description mt-8 block text-center">
-				Sběr dat o zákonném zástupci je klíčový pro získání důležitých kontaktů a informací.
-			</p>
-		<div class="flex w-full flex-col">
-			<span class="field">
-				<NameField
-						error={$typedErrors['parents'][0]['name'] || $typedErrors['parents'][0]['surname']}
-						on:change={handleChange}
-						bind:valueName={$form.parents[0].name}
-						bind:valueSurname={$form.parents[0].surname}
-						placeholder="Jméno a příjmení zákonného zástupce"
-				/>
-			</span>
-			<span class="field">
-				<EmailField
-						error={$typedErrors['parents'][0]['email']}
-					on:change={handleChange}
-						bind:value={$form.parents[0].email}
-						placeholder="E-mail zákonného zástupce"
-				/>
-			</span>
-			<span class="field">
-				<TelephoneField
-						error={$typedErrors['parents'][0]['telephone']}
-					on:change={handleChange}
-						bind:value={$form.parents[0].telephone}
-						placeholder="Telefon zákonného zástupce"
-				/>
-			</span>
-		</div>
-		{:else if pageIndex === 4}
-			<h1 class="title mt-8">{pageTexts[4]}</h1>
-			<p class="description mt-8 block text-center">
-				Zde můžete zadat údaje o druhém zákonném zástupci. Škole tím umožníte lépe komunikovat.
-			</p>
-			<div class="flex w-full flex-col">
-				<span class="field">
-					<NameField
-						error={$typedErrors['parents'][1]['name'] || $typedErrors['parents'][1]['surname']}
-						on:change={handleChange}
-						bind:valueName={$form.parents[1].name}
-						bind:valueSurname={$form.parents[1].surname}
-						placeholder="Jméno a příjmení zákonného zástupce (nepovinné)"
-					/>
-				</span>
-				<span class="field">
-					<EmailField
-						error={$typedErrors['parents'][1]['email']}
-						on:change={handleChange}
-						bind:value={$form.parents[1].email}
-						placeholder="E-mail zákonného zástupce (nepovinné)"
-					/>
-				</span>
-				<span class="field">
-					<TelephoneField
-						error={$typedErrors['parents'][1]['telephone']}
-						on:change={handleChange}
-						bind:value={$form.parents[1].telephone}
-						placeholder="Telefon zákonného zástupce (nepovinné)"
-					/>
+			{:else if pageIndex === 4}
+				<h1 class="title mt-8">{pageTexts[4]}</h1>
+				<p class="description mt-8 block text-center">
+					Zde můžete zadat údaje o druhém zákonném zástupci. Škole tím umožníte lépe komunikovat.
+				</p>
+				<div class="flex w-full flex-col">
+					<span class="field">
+						<NameField
+							error={$typedErrors['parents'][1]['name'] || $typedErrors['parents'][1]['surname']}
+							on:change={handleChange}
+							bind:valueName={$form.parents[1].name}
+							bind:valueSurname={$form.parents[1].surname}
+							placeholder="Jméno a příjmení zákonného zástupce (nepovinné)"
+						/>
 					</span>
-			</div>
-		{:else if pageIndex === 5}
-			<h1 class="title mt-8">{pageTexts[5]}</h1>
-			<p class="description mt-8 block text-center">
-				Zadejte prosím své občanství, rodné číslo, či jeho alternativu Vaší země a obor na který se hlásíte. 
-			</p>
-			<div class="flex w-full flex-row md:flex-col">
-				<span class="field">
-					<SelectField
-						error={$typedErrors['candidate']['citizenship']}
-						on:change={handleChange}
-						bind:value={$form.candidate.citizenship}
-						placeholder="Občanství"
-						options={['Česká republika', 'Slovenská republika', 'Ukrajina', 'Jiné']}
-					/>
-				</span>
-				<span class="field ml-2 md:ml-0">
-					<TextField on:change={handleChange} type="text" placeholder="Evidenční číslo přihlášky" />
-				</span>
-			</div>
-			<div class="field flex items-center justify-center">
-				{#if $form.candidate.citizenship === 'Česká republika' || !$form.candidate.citizenship}
-					<IdField
-						error={$typedErrors['candidate']['personalIdNumber']}
-						on:change={handleChange}
-						bind:value={$form.candidate.personalIdNumber}
-						placeholder="Rodné číslo"
-					/>
-				{:else}
-					<TextField
-						error={$typedErrors['candidate']['personalIdNumber']}
-						on:change={handleChange}
-						bind:value={$form.candidate.personalIdNumber}
-						placeholder="Rodné číslo"
-					/>
-				{/if}
-				<span class="ml-2">
-					<SelectField
-						error={$typedErrors['candidate']['study']}
-						on:change={handleChange}
-						bind:value={$form.candidate.study}
-						placeholder="Obor"
-						options={['KB', 'IT', 'G']}
-					/>
-				</span>
-			</div>
-		{/if}
+					<span class="field">
+						<EmailField
+							error={$typedErrors['parents'][1]['email']}
+							on:change={handleChange}
+							bind:value={$form.parents[1].email}
+							placeholder="E-mail zákonného zástupce (nepovinné)"
+						/>
+					</span>
+					<span class="field">
+						<TelephoneField
+							error={$typedErrors['parents'][1]['telephone']}
+							on:change={handleChange}
+							bind:value={$form.parents[1].telephone}
+							placeholder="Telefon zákonného zástupce (nepovinné)"
+						/>
+					</span>
+				</div>
+			{:else if pageIndex === 5}
+				<h1 class="title mt-8">{pageTexts[5]}</h1>
+				<p class="description mt-8 block text-center">
+					Zadejte prosím své občanství, rodné číslo, či jeho alternativu Vaší země a obor na který
+					se hlásíte.
+				</p>
+				<div class="flex w-full flex-row md:flex-col">
+					<span class="field">
+						<SelectField
+							error={$typedErrors['candidate']['citizenship']}
+							on:change={handleChange}
+							bind:value={$form.candidate.citizenship}
+							placeholder="Občanství"
+							options={['Česká republika', 'Slovenská republika', 'Ukrajina', 'Jiné']}
+						/>
+					</span>
+					<span class="field ml-2 md:ml-0">
+						<TextField
+							on:change={handleChange}
+							type="text"
+							placeholder="Evidenční číslo přihlášky"
+						/>
+					</span>
+				</div>
+				<div class="field flex items-center justify-center">
+					{#if $form.candidate.citizenship === 'Česká republika' || !$form.candidate.citizenship}
+						<IdField
+							error={$typedErrors['candidate']['personalIdNumber']}
+							on:change={handleChange}
+							bind:value={$form.candidate.personalIdNumber}
+							placeholder="Rodné číslo"
+						/>
+					{:else}
+						<TextField
+							error={$typedErrors['candidate']['personalIdNumber']}
+							on:change={handleChange}
+							bind:value={$form.candidate.personalIdNumber}
+							placeholder="Rodné číslo"
+						/>
+					{/if}
+					<span class="ml-2">
+						<SelectField
+							error={$typedErrors['candidate']['study']}
+							on:change={handleChange}
+							bind:value={$form.candidate.study}
+							placeholder="Obor"
+							options={['KB', 'IT', 'G']}
+						/>
+					</span>
+				</div>
+			{/if}
 		</div>
-		<div class="controls w-full absolute bottom-1/12">
+		<div class="controls bottom-1/12 absolute w-full">
 			<div class="field">
 				<Submit
 					on:click={async (e) => {
@@ -569,8 +576,8 @@
 					value={pageIndex === pageCount ? 'Odeslat' : 'Pokračovat'}
 				/>
 			</div>
-	
-			<div class="mt-4 md:mt-8 flex flex-row justify-center">
+
+			<div class="mt-4 flex flex-row justify-center md:mt-8">
 				{#each Array(pageCount + 1) as _, i}
 					<button
 						class:dotActive={i === pageIndex}
@@ -578,7 +585,7 @@
 							pageIndex -= pageIndex === pageCount ? 1 : 0;
 							await handleSubmit(e);
 							pagesFilled = pagesFilled.map((_, i) => !isPageInvalid(i));
-	
+
 							const progress = pagesFilled.slice(0, i).every((item) => item === true);
 							if (progress) {
 								pageIndex = i;
@@ -594,7 +601,7 @@
 
 <style lang="postcss">
 	.field {
-		@apply mt-4 md:mt-8 w-full lg:w-4/5 lg:mx-auto;
+		@apply mt-4 w-full md:mt-8 lg:mx-auto lg:w-4/5;
 	}
 	.form {
 		@apply flex flex-col;
@@ -618,6 +625,6 @@
 		@apply text-gray-500;
 	}
 	.title {
-		@apply text-sspsBlue text-4xl font-semibold text-center;
+		@apply text-sspsBlue text-center text-4xl font-semibold;
 	}
 </style>
diff --git a/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte b/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte
index cbaa92a..af5e936 100644
--- a/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte
+++ b/frontend/src/routes/(candidate)/auth/login/[code=application]/+page.svelte
@@ -130,7 +130,7 @@
 	input {
 		@apply text-sspsBlue text-center font-semibold;
 		@apply transition-colors duration-300;
-		@apply focus:border-sspsBlue hover:border-sspsBlue rounded-xl border border-2 bg-[#f8fafb] p-3 md:caret-transparent shadow-lg outline-none;
+		@apply focus:border-sspsBlue hover:border-sspsBlue rounded-xl border border-2 bg-[#f8fafb] p-3 shadow-lg outline-none md:caret-transparent;
 	}
 	.separater {
 		@apply bg-sspsBlue mr-2 hidden h-2 w-8 md:block;