📱 made more responsive
Co-authored-by: Sindre Kjelsrud <kjelsrudsindre@gmail.com>
This commit is contained in:
parent
15ce277167
commit
4a93ac4552
13 changed files with 42 additions and 37 deletions
|
|
@ -14,8 +14,8 @@
|
|||
import Select from "./inputs/Select.svelte";
|
||||
</script>
|
||||
|
||||
<div class="flex justify-start items-center h-1/4 w-full ">
|
||||
<p class="text-primary font-bold w-1/5">{label}:</p>
|
||||
<div class="flex flex-col md:flex-row justify-between md:justify-start items-start gap-3 md:gap-0 md:h-1/4 w-full">
|
||||
<p class="text-primary font-bold w-auto">{label}:</p>
|
||||
{#if inputType == "radio"}
|
||||
<RadioButtons on:update={(e) => handleFormChange(e.detail)} selected={formData} options={options}/>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@
|
|||
export let selected: string
|
||||
</script>
|
||||
|
||||
<div class="flex justify-between w-full">
|
||||
<div class="flex justify-between w-full md:pl-5">
|
||||
{#each options as data, index (data)}
|
||||
<button name={data} on:click={() => handleButtonClick(data)} class="flex flex-col justify-start items-center w-12 text-center hover:cursor-pointer">
|
||||
<div class={`${selected == data && "bg-primary"} flex justify-center items-center h-6 w-6 rounded-full border-2 border-primary hover:bg-primary`}>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
export let options:string[]
|
||||
</script>
|
||||
|
||||
<select class="ml-6 pl-2 pr-16 py-2 rounded-xl text-primary border-primary border-2 text-start hover:cursor-pointer ">
|
||||
<select class="md:ml-6 pl-2 pr-16 py-2 rounded-xl text-primary border-primary border-2 text-start hover:cursor-pointer ">
|
||||
{#each options as data, index (data)}
|
||||
<option on:click={() => handleButtonClick(data)} id={data}>{data}</option>
|
||||
{/each}
|
||||
|
|
|
|||
Reference in a new issue