From f10209a5f63f6423ed6dc42e129b40ccefff76c7 Mon Sep 17 00:00:00 2001
From: Vaclav Uruba <uruba@outlook.com>
Date: Fri, 8 Sep 2023 01:13:54 +0200
Subject: [PATCH] update layout

---
 src/app.html                         |  2 +-
 src/lib/calculator/Calculator.svelte |  7 ++++++-
 src/routes/+layout.svelte            |  4 ++++
 src/routes/+page.svelte              | 20 +++++++++++++++++---
 4 files changed, 28 insertions(+), 5 deletions(-)
diff --git a/src/app.html b/src/app.html
index 73e95fa..9eabedf 100644
--- a/src/app.html
+++ b/src/app.html
@@ -7,6 +7,6 @@
 		%sveltekit.head%
 	</head>
 	<body data-sveltekit-preload-data="hover">
-		<main>%sveltekit.body%</main>
+		%sveltekit.body%
 	</body>
 </html>
diff --git a/src/lib/calculator/Calculator.svelte b/src/lib/calculator/Calculator.svelte
index 02b03c2..13367a2 100644
--- a/src/lib/calculator/Calculator.svelte
+++ b/src/lib/calculator/Calculator.svelte
@@ -111,7 +111,7 @@
 	<input
 		id="finalPrice"
 		type="number"
-		min="0 "
+		min="0"
 		bind:value={calcValues.finalPrice}
 		class:invalid={calcValues.finalPrice === null}
 		on:focus={handleFocus}
@@ -133,10 +133,15 @@
 
 	input {
 		width: 100%;
+		margin: 0.25em 0 0.625em;
 		border: 2px solid gray;
 		border-radius: 3px;
 	}
 
+	input:last-child {
+		margin-bottom: 1.25em;
+	}
+
 	input.invalid {
 		border: 4px solid var(--invalid-color);
 	}
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index be6398b..f9dc93b 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -8,4 +8,8 @@
 	:root {
 		--invalid-color: red;
 	}
+
+  :global(body) {
+      padding: 0 0.5em;
+  }
 </style>
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index bb7b36f..373ac32 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -2,8 +2,22 @@
 	import Calculator from '$lib/calculator/Calculator.svelte';
 </script>
 
-<h1>DPHčko.cz</h1>
+<header>
+  <h1>DPHčko.cz</h1>
+</header>
 
-<p>Kalkulačka DPH – spočítejte si daň z přidané hodnoty</p>
+<main>
+  <p>Kalkulačka DPH – spočítejte si daň z přidané hodnoty</p>
 
-<Calculator />
+  <Calculator />
+</main>
+
+<style>
+  header {
+      padding: 1em 0 1.5em;
+  }
+
+  p {
+      margin-bottom: 1.25em;
+  }
+</style>
\ No newline at end of file
