From ce922607bd709769b08e1fdb50592691923aa854 Mon Sep 17 00:00:00 2001
From: EETagent <vojta.jungmann@gmail.com>
Date: Tue, 29 Nov 2022 11:42:35 +0100
Subject: [PATCH] feat: move badge to own component

---
 frontend/src/lib/assets/logo/{lev.png => lion.png}  | Bin
 .../src/lib/components/icons/SchoolBadge.svelte     |  12 ++++++++++++
 frontend/src/routes/login/+page.svelte              |   7 ++-----
 frontend/src/routes/register/+page.svelte           |  10 ++++------
 4 files changed, 18 insertions(+), 11 deletions(-)
 rename frontend/src/lib/assets/logo/{lev.png => lion.png} (100%)
 create mode 100644 frontend/src/lib/components/icons/SchoolBadge.svelte

diff --git a/frontend/src/lib/assets/logo/lev.png b/frontend/src/lib/assets/logo/lion.png
similarity index 100%
rename from frontend/src/lib/assets/logo/lev.png
rename to frontend/src/lib/assets/logo/lion.png
diff --git a/frontend/src/lib/components/icons/SchoolBadge.svelte b/frontend/src/lib/components/icons/SchoolBadge.svelte
new file mode 100644
index 0000000..145f7fe
--- /dev/null
+++ b/frontend/src/lib/components/icons/SchoolBadge.svelte
@@ -0,0 +1,12 @@
+<script lang="ts">
+    import lion from '$lib/assets/logo/lion.png';
+    </script>
+<div
+	class="py-3 px-6 md:py-4 md:px-8 rounded-[999px] shadow-2xl flex items-center justify-center transition-all duration-700 hover:shadow-md"
+>
+	<img class="object-cover" src={lion} alt="" />
+</div>
+
+<style>
+
+</style>
\ No newline at end of file
diff --git a/frontend/src/routes/login/+page.svelte b/frontend/src/routes/login/+page.svelte
index 3a98621..f34fbd3 100644
--- a/frontend/src/routes/login/+page.svelte
+++ b/frontend/src/routes/login/+page.svelte
@@ -2,6 +2,7 @@
 	import { goto } from '$app/navigation';
 
 	import lev from '$lib/assets/logo/lev.png';
+	import SchoolBadge from '$lib/components/icons/SchoolBadge.svelte';
 	import SplitLayout from '$lib/components/layout/SplitLayout.svelte';
 	import TextField from '$lib/components/textfield/TextField.svelte';
 
@@ -17,11 +18,7 @@
 
 <SplitLayout>
 	<div class="form">
-		<div
-			class="py-3 px-6 md:py-4 md:px-8 rounded-[999px] shadow-2xl flex items-center justify-center"
-		>
-			<img class="object-cover" src={lev} alt="" />
-		</div>
+		<SchoolBadge />
 		<h1 class="mt-8 text-4xl text-sspsBlue font-semibold">Přihlášení</h1>
 		<p class="my-8 font-light text-sspsGray text-center">
 			Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br /> Fusce suscipit libero eget elit.
diff --git a/frontend/src/routes/register/+page.svelte b/frontend/src/routes/register/+page.svelte
index a33ed32..5c6df36 100644
--- a/frontend/src/routes/register/+page.svelte
+++ b/frontend/src/routes/register/+page.svelte
@@ -1,9 +1,9 @@
 <script lang="ts">
 	import { goto } from '$app/navigation';
 
-	import lev from '$lib/assets/logo/lev.png';
 	import Email from '$lib/components/icons/Email.svelte';
 	import Home from '$lib/components/icons/Home.svelte';
+	import SchoolBadge from '$lib/components/icons/SchoolBadge.svelte';
 	import Telephone from '$lib/components/icons/Telephone.svelte';
 	import SplitLayout from '$lib/components/layout/SplitLayout.svelte';
 	import IdField from '$lib/components/textfield/IdField.svelte';
@@ -16,7 +16,7 @@
 	let applicationValue = '';
 
 	const pageCount = 3;
-	let pageIndex = 2;
+	let pageIndex = 0;
 	let pagesFilled = 0;
 
 	const formInitialValues = {
@@ -94,10 +94,8 @@
 
 <SplitLayout>
 	<div class="form">
-		<div
-			class="w-24 h-24 md:w-auto md:h-auto py-3 px-6 md:py-4 md:px-8 rounded-[999px] shadow-2xl flex items-center justify-center"
-		>
-			<img class="object-cover" src={lev} alt="" />
+		<div class="w-24 h-24 md:w-auto md:h-auto">
+			<SchoolBadge />
 		</div>
 		{#if pageIndex === 0}
 			<form on:submit={handleSubmit}>