diff --git a/src/views/ConfigAccountNumberView.vue b/src/views/ConfigAccountNumberView.vue index f49e366564cb43461ce767971d4522dffce55939..3102f5112df4b323097bb8ce7029abc5fbbe1994 100644 --- a/src/views/ConfigAccountNumberView.vue +++ b/src/views/ConfigAccountNumberView.vue @@ -6,7 +6,8 @@ Legg til kontonummer for sparekonto og brukskonto </h1> <div class="absolute bottom-0 md:bottom-40 left-0 w-40 h-40 md:w-52 md:h-52 ml-4"> - <SpareComponent + <p class="text-sm font-bold mb-3 animate-bounce">Trykk pÃ¥ meg for hjelp â—ï¸</p> + <SpareComponent :speech="[ 'Her skriver du inn kontonummer for sparekonto og brukskonto. 🪩', 'Sparekonto er kontoen du vil legge alle dine oppsparte penger pÃ¥!', @@ -17,7 +18,6 @@ :direction="'right'" :imageDirection="'right'" ></SpareComponent> - <p class="text-xs absolute left-0 md:ml-3 ml-1 mt-2">Trykk pÃ¥ meg for hjelp â—ï¸</p> </div> <div class="flex flex-col items-center justify-center bg-white rounded-lg p-8 shadow-lg w-full md:w-[45%]" @@ -49,7 +49,8 @@ /> </div> </div> - <div class="absolute bottom-36 right-2"> + <p class="mt-10">Husk at du kan endre dette senere!</p> + <div class="absolute bottom-36 right-2"> <ContinueButtonComponent @click="onButtonClick" :disabled="!isFormValid" diff --git a/src/views/ConfigFamiliarWithSavingsView.vue b/src/views/ConfigFamiliarWithSavingsView.vue index 693200e8d5a7744b4e4d1468889167d8a7dd33db..b93e98da8a9f97d86847f3dffa6185f299086082 100644 --- a/src/views/ConfigFamiliarWithSavingsView.vue +++ b/src/views/ConfigFamiliarWithSavingsView.vue @@ -1,18 +1,19 @@ <template> <div class="flex flex-col items-center justify-center min-h-screen px-4 text-center"> - <h1 class="mb-8 text-2xl font-bold sm:mb-16 sm:text-4xl"> + <h1 class="mb-8 md:mb-16 text-2xl font-bold sm:text-4xl"> Hvor kjent er du med sparing fra før? </h1> <div class="absolute bottom-0 md:bottom-40 left-0 w-40 h-40 md:w-52 md:h-52 ml-4"> + <p class="text-sm font-bold mb-3 animate-bounce">Trykk pÃ¥ meg for hjelp â—ï¸</p> <SpareComponent :speech="[ - 'Her kan du fylle inn hvor kjent du er med sparing fra før, slik at vi kan hjelpe deg pÃ¥ best mulig mÃ¥te! 💡' + 'Her kan du fylle inn hvor kjent du er med sparing fra før, slik at vi kan hjelpe deg pÃ¥ best mulig mÃ¥te! 💡', + 'Hvis du er usikker, velg det alternativet som passer best. Du kan endre dette senere!' ]" :png-size="10" :direction="'right'" :imageDirection="'right'" ></SpareComponent> - <p class="text-xs absolute left-0 md:ml-3 ml-1 mt-2">Trykk pÃ¥ meg for hjelp â—ï¸</p> </div> <div class="grid grid-cols-1 gap-8 mb-16 sm:gap-14 sm:mb-20 md:grid-cols-3"> <div @@ -49,6 +50,7 @@ <p class="mt-2 text-lg font-bold">Godt kjent</p> </div> </div> + <p class="mb-8 md:mb-12">Husk at du kan endre dette senere!</p> <ContinueButtonComponent :disabled="selectedOption === null" @click="onButtonClick" diff --git a/src/views/ConfigHabitChangeView.vue b/src/views/ConfigHabitChangeView.vue index fec0b011cbd1d06208b65381f54d4a318a93843c..c243c88c2e029ebdc25a2f0e49b1b32fdbb1a9b6 100644 --- a/src/views/ConfigHabitChangeView.vue +++ b/src/views/ConfigHabitChangeView.vue @@ -1,18 +1,19 @@ <template> <div class="flex flex-col items-center justify-center min-h-screen px-4 text-center"> - <h1 class="mb-8 text-2xl font-bold sm:mb-16 sm:text-4xl"> + <h1 class="mb-8 md:mb-16 text-2xl font-bold sm:text-4xl"> Hvor store vaneedringer er du villig til Ã¥ gjøre? </h1> <div class="absolute bottom-0 md:bottom-40 left-0 w-40 h-40 md:w-52 md:h-52 ml-4"> + <p class="text-sm font-bold mb-3 animate-bounce">Trykk pÃ¥ meg for hjelp â—ï¸</p> <SpareComponent :speech="[ - 'Her kan du velge hvor mye innsats du er villig til Ã¥ legge inn for Ã¥ endre vanene dine! 📚' + 'Her kan du velge hvor mye innsats du er villig til Ã¥ legge inn for Ã¥ endre vanene dine! 📚', + 'Hvis du er usikker, velg det alternativet som passer best. Du kan endre dette senere!' ]" :png-size="10" :direction="'right'" :imageDirection="'right'" ></SpareComponent> - <p class="text-xs absolute left-0 md:ml-3 ml-1 mt-2">Trykk pÃ¥ meg for hjelp â—ï¸</p> </div> <div class="grid grid-cols-1 gap-8 mb-16 sm:gap-14 sm:mb-20 md:grid-cols-3"> <div @@ -49,6 +50,7 @@ <p class="mt-2 text-md sm:text-lg font-bold">Store</p> </div> </div> + <p class="mb-8 md:mb-12">Husk at du kan endre dette senere!</p> <ContinueButtonComponent :disabled="selectedOption === null" @click="onButtonClick" diff --git a/src/views/ConfigSpendingItemsAmountView.vue b/src/views/ConfigSpendingItemsAmountView.vue index ef2ac42c27859374f0ab7f4e07115e07093e950d..4f63e2d6e2d0bc7ea450b1fa2dc959b5c5c6b041 100644 --- a/src/views/ConfigSpendingItemsAmountView.vue +++ b/src/views/ConfigSpendingItemsAmountView.vue @@ -1,19 +1,21 @@ <template> <div class="flex flex-col items-center justify-center min-h-screen px-4 text-center relative"> - <h1 class="mb-8 text-2xl font-bold sm:mb-16 sm:text-4xl"> + <h1 class="mb-2 text-2xl font-bold sm:text-4xl"> Hvor mye bruker du per kjøp pÃ¥ ... </h1> + <p class="text-sm mb-8 md:mb-10">Her kan du skrive inn hvor mye du bruker per kjøp pÃ¥ ulike kategorier</p> <div class="absolute bottom-0 md:bottom-40 left-0 w-40 h-40 md:w-52 md:h-52 ml-4"> + <p class="text-sm font-bold mb-3 animate-bounce">Trykk pÃ¥ meg for hjelp â—ï¸</p> <SpareComponent :speech="[ 'Her kan du skrive inn hvor mye penger du bruker per kjøp pÃ¥ ulike ting. ðŸ”', - 'For eksempel koster en kopp kaffe â˜•ï¸ kanskje 30 kr, mens en kinobillett ðŸŽŸï¸ koster 100 kr.' + 'For eksempel koster en kopp kaffe â˜•ï¸ kanskje 30 kr, mens en kinobillett ðŸŽŸï¸ koster 100 kr.', + 'Du kan redigere dette senere!' ]" :png-size="10" :direction="'right'" :imageDirection="'right'" ></SpareComponent> - <p class="text-xs absolute left-0 md:ml-3 ml-1 mt-2">Trykk pÃ¥ meg for hjelp â—ï¸</p> </div> <div class="w-full flex justify-center"> <div :class="[showSecondBox ? 'md:grid md:grid-cols-2 md:gap-4 sm:gap-8 mb-6' : '']"> @@ -76,6 +78,7 @@ </div> </div> </div> + <p class="mt-10">Husk at du kan endre dette senere!</p> <div class="w-full text-right"> <ContinueButtonComponent @click="onButtonClick" diff --git a/src/views/ConfigSpendingItemsTotalAmountView.vue b/src/views/ConfigSpendingItemsTotalAmountView.vue index 0291e9e917bf503a4ff77a066b0062b43c23172f..16171fae13b9c1c4cce3aa459590a89fd4d1a3b2 100644 --- a/src/views/ConfigSpendingItemsTotalAmountView.vue +++ b/src/views/ConfigSpendingItemsTotalAmountView.vue @@ -1,19 +1,21 @@ <template> <div class="flex flex-col items-center justify-center min-h-screen px-4 text-center relative"> - <h1 class="mb-8 text-2xl font-bold sm:mb-16 sm:text-4xl"> + <h1 class="mb-2 text-2xl font-bold sm:text-4xl"> Hvor mye bruker du per uke pÃ¥ ... </h1> + <p class="text-sm mb-8 md:mb-10">Her kan du skrive inn hvor mye du bruker per uke pÃ¥ ulike kategorier</p> <div class="absolute bottom-0 md:bottom-40 left-0 w-40 h-40 md:w-52 md:h-52 ml-4"> + <p class="text-sm font-bold mb-3 animate-bounce">Trykk pÃ¥ meg for hjelp â—ï¸</p> <SpareComponent :speech="[ 'Her skal du skrive inn hvor mye du bruker per uke pÃ¥ ulike kategorier. 🗓ï¸', - 'Hvis du kjøper kaffe hver dag, kan du skrive inn hvor mye du bruker pÃ¥ kaffe per uke.' + 'Hvis du kjøper kaffe hver dag, kan du skrive inn hvor mye du bruker pÃ¥ kaffe per uke.', + 'Du kan redigere dette senere!' ]" :png-size="10" :direction="'right'" :imageDirection="'right'" ></SpareComponent> - <p class="text-xs absolute left-0 md:ml-3 ml-1 mt-2">Trykk pÃ¥ meg for hjelp â—ï¸</p> </div> <div class="w-full flex justify-center"> <div :class="[showSecondBox ? 'md:grid md:grid-cols-2 md:gap-4 sm:gap-8 mb-6' : '']"> @@ -76,6 +78,7 @@ </div> </div> </div> + <p class="mt-10">Husk at du kan endre dette senere!</p> <div class="w-full text-right"> <ContinueButtonComponent @click="onButtonClick" diff --git a/src/views/ConfigSpendingItemsView.vue b/src/views/ConfigSpendingItemsView.vue index d3e032d9b5bf5d74bd9b3b46cc88ed83f57544e7..c983f3e100f9036265fae0c93a746762a7f23f0d 100644 --- a/src/views/ConfigSpendingItemsView.vue +++ b/src/views/ConfigSpendingItemsView.vue @@ -1,18 +1,20 @@ <template> <div class="flex flex-col items-center justify-center min-h-screen text-center"> - <h1 class="mb-8 text-2xl font-bold sm:mb-16 sm:text-4xl">Hva bruker du mye penger pÃ¥?</h1> + <h1 class="mb-3 text-2xl font-bold sm:text-4xl mt-0 md:mt-7">Hva bruker du mye penger pÃ¥?</h1> + <p class="text-sm mb-8 md:mb-10">Hvis du ikke finner noe som passer, kan du skrive inn egne kategorier i "Annet ..." feltet</p> <div class="absolute bottom-0 md:bottom-40 left-0 w-40 h-40 md:w-52 md:h-52 ml-4"> + <p class="text-sm font-bold mb-3 animate-bounce">Trykk pÃ¥ meg for hjelp â—ï¸</p> <SpareComponent :speech="[ 'Her kan du velge hva du bruker mye penger pÃ¥, slik at vi kan hjelpe deg med Ã¥ spare penger! 💸', 'Hvis du ikke finner noe som passer, kan du skrive inn egne kategorier i \'Annet ...\' feltet', - 'Du mÃ¥ minst velge en kategori!' + 'Du mÃ¥ minst velge en kategori!', + 'Du kan redigere dette senere!' ]" :png-size="10" :direction="'right'" :imageDirection="'right'" ></SpareComponent> - <p class="text-xs absolute left-0 md:ml-3 ml-1 mt-2">Trykk pÃ¥ meg for hjelp â—ï¸</p> </div> <div class="flex flex-wrap justify-center gap-8 mb-8"> <div @@ -66,6 +68,7 @@ </div> </div> </div> + <p class="mb-1">Husk at du kan endre dette senere!</p> <div class="w-full text-right"> <ContinueButtonComponent @click="onButtonClick"