📱 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
|
|
@ -2,6 +2,6 @@
|
|||
import "../app.css";
|
||||
</script>
|
||||
|
||||
<div class="bg-bg w-screen h-screen px-28 py-6">
|
||||
<div class="bg-bg w-screen h-full px-8 md:px-28 py-6">
|
||||
<slot />
|
||||
</div>
|
||||
|
|
@ -1,29 +1,29 @@
|
|||
<script>
|
||||
import ButtonComponent from "../components/userform/inputs/ButtonComponent.svelte";
|
||||
</script>
|
||||
<div class="flex flex-col justify-between items-center h-full">
|
||||
<div class="flex h-full items-center">
|
||||
<div class="flex flex-col w-3/5 gap-4 px-32">
|
||||
<h1 class="text-7xl text-primary font-bold">Helseveileder</h1>
|
||||
<div class="flex flex-col justify-between items-center h-full w-full">
|
||||
<div class="flex flex-col md:flex-row h-full w-full items-center">
|
||||
<div class="flex flex-col w-11/12 md:w-3/5 gap-2 md:gap-4 md:px-32">
|
||||
<h1 class="text-5xl md:text-7xl text-primary font-bold pb-2">Helseveileder</h1>
|
||||
<p>Vi utfører en undersøkelse om kunstig intelligens (AI) i medisin. Vi ønsker å forstå hvordan AI kan fungere som en copilot for leger og pasienter.</p>
|
||||
<p>Undersøkelsen er helt anonym.</p>
|
||||
<ul>
|
||||
<p>I denne undersøkelsen vil vi at du skal vurdere empati, kunnskap og hjelpsomhet i ulike svar på medisinske spørsmål.</p>
|
||||
<p class="mb-4">I denne undersøkelsen vil vi at du skal vurdere empati, kunnskap og hjelpsomhet i ulike svar på medisinske spørsmål.</p>
|
||||
<li><strong>Empati:</strong> Evnen til å oppdage og erkjenne andres følelser og tanker.</li>
|
||||
<li><strong>Kunnskap:</strong> Nøyaktighet og relevans av den medisinske informasjonen gitt.</li>
|
||||
<li><strong>Hjelpsomhet:</strong> Evnen til å gi nyttig og praktisk råd eller støtte.</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
<div class="flex justify-center items-center w-2/5">
|
||||
<div class="flex justify-center items-center md:w-2/5 mt-8 md:mt-0">
|
||||
<a href="/userform">
|
||||
<ButtonComponent text="Start undersøkelse" filled={false} />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center items-center gap-8 text-primary font-bold">
|
||||
<button><a href="/personvern">Personvern</a></button>
|
||||
<button><a href="/info">Mer info</a></button>
|
||||
<div class="flex justify-center items-center gap-20 md:gap-20 text-primary font-bold mt-10 md:mt-0">
|
||||
<button class="w-20"><a href="/personvern">Personvern</a></button>
|
||||
<button class="w-20"><a href="/info">Mer info</a></button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -15,15 +15,15 @@
|
|||
</script>
|
||||
|
||||
<div class="flex flex-col justify-between items-center h-full">
|
||||
<div class="flex flex-col gap-8 h-full mt-8">
|
||||
<div class="flex flex-col gap-4 px-96 items-center">
|
||||
<div class="flex flex-col gap-14 md:gap-8 h-full mt-8">
|
||||
<div class="flex flex-col gap-4 md:px-96 items-center">
|
||||
<h1 class="text-3xl text-primary font-bold">Takk for at du tok deg tid!</h1>
|
||||
<p>Tusen takk for hjelpen i denne undersøkelsen! Vi setter stor pris på det og håper du får en fin dag videre.</p>
|
||||
<p>Har du tid så setter vi veldig pris på om du skrevet en liten tilbakemelding til oss i tekstfeltet under:</p>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-4 justify-center items-center">
|
||||
<textarea bind:value={evaluationText} cols="30" rows="8" class="border-solid border-gray-400 border-2 p-3 md:text-l w-1/3" placeholder="Skriv evaluering her"></textarea>
|
||||
<div class="flex flex-col gap-12 md:gap-8 justify-center items-center">
|
||||
<textarea bind:value={evaluationText} cols="30" rows="8" class="border-solid border-gray-400 border-2 p-3 md:text-l md:w-1/3 rounded-md" placeholder="Skriv evaluering her"></textarea>
|
||||
<button
|
||||
class="text-primary hover:bg-primary hover:text-bg font-bold border-primary border-2 rounded-full px-8 py-1"
|
||||
on:click={handleEvaluationSubmit}
|
||||
|
|
|
|||
|
|
@ -63,9 +63,9 @@
|
|||
});
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col h-full">
|
||||
<div class="flex flex-col h-full gap-4">
|
||||
<FormHeader questionNum={questionNumber} formQuestion={formQuestion}/>
|
||||
<div class="flex h-full justify-between gap-12">
|
||||
<div class="flex flex-col md:flex-row h-full justify-between gap-12">
|
||||
{#key questionNumber}
|
||||
<AnswerBox on:update={(e) => question1Answered = e.detail} answerNum={1} answerText={questionAnswer1Text} answerID={questionAnswer1ID}/>
|
||||
<AnswerBox on:update={(e) => question2Answered = e.detail} answerNum={2} answerText={questionAnswer2Text} answerID={questionAnswer2ID}/>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<div class="flex flex-col justify-between items-center h-full">
|
||||
<div class="flex h-full mt-8">
|
||||
<div class="flex flex-col gap-4 px-96 items-center">
|
||||
<div class="flex flex-col gap-4 md:px-96 items-center">
|
||||
<h1 class="text-3xl text-primary font-bold">Personvern</h1>
|
||||
<p>
|
||||
Vi verdsetter din deltakelse i denne studien. Som en del av vår forpliktelse til å sikre personvern, ønsker vi å informere deg om hvordan vi håndterer dine data.
|
||||
|
|
@ -13,7 +13,7 @@
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center items-center gap-8 text-primary font-bold">
|
||||
<div class="flex justify-center items-center gap-8 mt-10 md:mt-0 text-primary font-bold">
|
||||
<button><a href="/">Tilbake</a></button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -28,17 +28,17 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<div class="flex flex-col justify-center gap-20 h-full ">
|
||||
<a class="ml-32" href="/">
|
||||
<div class="flex flex-col md:justify-center gap-6 md:gap-20 h-full">
|
||||
<a class="md:ml-32" href="/">
|
||||
<ArrowBack width="2rem" />
|
||||
</a>
|
||||
<div class="flex h-4/5 ">
|
||||
<div class="flex flex-col justify-center w-2/4 gap-4 px-32 ">
|
||||
<h1 class="text-3xl text-primary font-bold">Informasjon om deltaker</h1>
|
||||
<div class="flex flex-col md:flex-row h-full md:h-4/5 gap-6">
|
||||
<div class="flex flex-col justify-center w-full md:w-2/4 gap-4 md:px-32 ">
|
||||
<h1 class="text-3xl text-primary font-bold">Deltakerinformasjon</h1>
|
||||
<p>Til undersøkelsen trenger vi opplysninger om din aldersgruppe, utdanningsgrad, kjønn og bekreftelse på at du er helsepersonell.</p>
|
||||
<p>Vi vil igjen minne om at denne undersøkelsen er helt anonym. Se <a href="/personvern"class="text-primary font-bold">Personvern</a> for mer informasjon.</p>
|
||||
</div>
|
||||
<div class="flex flex-col justify-start items-center w-2/4">
|
||||
<div class="flex flex-col gap-6 justify-start items-center md:w-2/4">
|
||||
<UserFormInput formData={age} on:update={(e) => age = e.detail} inputType="radio" label="Alder" options={["18-20", "20-30", "30-40", "40-50", "50-60"]}/>
|
||||
<UserFormInput formData={education} on:update={(e) => education = e.detail} inputType="select" label="Utdanningsgrad" options={["PhD", "Master", "Fagbrev", "Bachelor"]}/>
|
||||
<UserFormInput formData={county} on:update={(e) => county = e.detail} inputType="select" label="Fylke" options={["Vestland", "Rogaland", "Møre og Romsdal", "Oslo", "Viken", "Nordland", "Trøndelag", "Innlandet", "Troms og Finnmark", "Vestfold og Telemark", "Agder"]}/>
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
<UserFormInput formData={has_answered_before} on:update={(e) => has_answered_before = e.detail} inputType="radio" label="Jeg har svart på denne undersøkelsen tidligere" options={["Ja", "Nei"]}/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex justify-center items-center gap-8 text-primary font-bold">
|
||||
<div class="flex justify-center items-center gap-8 text-primary font-bold py-10 md:py-0">
|
||||
<ButtonComponent text="Start undersøkelse" filled={true} onclick={() => handleUserformSubmit(age, education, healthcare_personnel, gender, has_answered_before, county)} />
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Reference in a new issue