styling in equal unified format

This commit is contained in:
waltem01 2024-02-16 13:07:20 +01:00
parent 688447e63c
commit 16d426c23b

View File

@ -139,10 +139,12 @@
});
</script>
<form on:submit|preventDefault={handleSubmit}>
<label for="x">Set X coordinate:</label
<form class="grid grid-rows-5 m-1" on:submit|preventDefault={handleSubmit}>
<div class="grid grid-cols-2">
<label class="border-2 border-black border-r-0 border-b-0 pl-1" for="x">Set X coordinate:</label
>
<input
class="border-2 border-black border-b-0 cursor-text pl-1 bg-gray-100"
type="number"
name="x"
id="x"
@ -151,10 +153,13 @@
step="1"
value="0"
/>
</div>
<label for="y">Set Y coordinate:</label
<div class="grid grid-cols-2">
<label class="border-2 border-black border-r-0 border-b-0 pl-1" for="y">Set Y coordinate:</label
>
<input
class="border-2 border-black border-b-0 cursor-text pl-1 bg-gray-100"
type="number"
name="y"
id="y"
@ -163,9 +168,12 @@
step="1"
value="0"
/>
</div>
<label for="w">Set image width:</label>
<div class="grid grid-cols-2">
<label class="border-2 border-black border-r-0 border-b-0 pl-1" for="w">Set image width:</label>
<input
class="border-2 border-black border-b-0 cursor-text pl-1 bg-gray-100"
type="number"
name="w"
id="w"
@ -174,10 +182,13 @@
step="1"
value={matrix?.width ?? 192}
/>
</div>
<label for="h">Set image height:</label
<div class="grid grid-cols-2">
<label class="border-2 border-black border-r-0 border-b-0 pl-1" for="h">Set image height:</label
>
<input
class="border-2 border-black border-b-0 cursor-text pl-1 bg-gray-100"
type="number"
name="h"
id="h"
@ -186,10 +197,13 @@
step="1"
value={matrix?.height ?? 192}
/>
</div>
<label for="image">Set an image:</label
<div class="grid grid-cols-2">
<label class="border-2 border-black border-r-0 border-b-0 pl-1" for="image">Set an image:</label
>
<input
class="border-2 border-black border-b-0 bg-gray-100"
type="file"
name="image"
id="image"
@ -197,13 +211,15 @@
required
on:change={getImage}
/>
</div>
<input
class="border-2 border-black hover:bg-gray-200 cursor-pointer"
type="submit"
value="Upload!"
/>
{#if imageURL}
<img src={imageURL} alt="User uploaded" />
<img class="mt-5 block ml-auto mr-auto" src={imageURL} alt="User uploaded" />
{/if}
</form>
{#if uploadStarted}