DPHcko.cz/dphcko-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update layout

Browse Source
This commit is contained in:
Vaclav Uruba 2023-09-08 01:13:54 +02:00
parent 6998060494
commit f10209a5f6
Signed by: uruba
GPG Key ID: 9D8E987C4B2E1E9C
4 changed files with 28 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app.html
View File

@ -7,6 +7,6 @@
%sveltekit.head% %sveltekit.head%
</head> </head>
<body data-sveltekit-preload-data="hover"> <body data-sveltekit-preload-data="hover">
<main>%sveltekit.body%</main> %sveltekit.body%
</body> </body>
</html> </html>

7
src/lib/calculator/Calculator.svelte
View File

@ -111,7 +111,7 @@
<input <input
id="finalPrice" id="finalPrice"
type="number" type="number"
min="0 " min="0"
bind:value={calcValues.finalPrice} bind:value={calcValues.finalPrice}
class:invalid={calcValues.finalPrice === null} class:invalid={calcValues.finalPrice === null}
on:focus={handleFocus} on:focus={handleFocus}
@ -133,10 +133,15 @@
input { input {
width: 100%; width: 100%;
margin: 0.25em 0 0.625em;
border: 2px solid gray; border: 2px solid gray;
border-radius: 3px; border-radius: 3px;
} }
input:last-child {
margin-bottom: 1.25em;
}
input.invalid { input.invalid {
border: 4px solid var(--invalid-color); border: 4px solid var(--invalid-color);
} }

4
src/routes/+layout.svelte
View File

@ -8,4 +8,8 @@
:root { :root {
--invalid-color: red; --invalid-color: red;
} }
:global(body) {
padding: 0 0.5em;
}
</style> </style>

20
src/routes/+page.svelte
View File

@ -2,8 +2,22 @@
import Calculator from '$lib/calculator/Calculator.svelte'; import Calculator from '$lib/calculator/Calculator.svelte';
</script> </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>