diff --git a/src/assets/bakgrunn.png b/src/assets/bakgrunn.png
new file mode 100644
index 0000000000000000000000000000000000000000..7c002fbb47bcef42217ac561c68abca83362d828
Binary files /dev/null and b/src/assets/bakgrunn.png differ
diff --git a/src/assets/finishline2.png b/src/assets/finishline2.png
new file mode 100644
index 0000000000000000000000000000000000000000..251d099d41b7887bde06385be18e548d727d0ec6
Binary files /dev/null and b/src/assets/finishline2.png differ
diff --git a/src/assets/start-sign.png b/src/assets/start-sign.png
new file mode 100644
index 0000000000000000000000000000000000000000..ece9e3aab84d9a320ed803d9db25b04723fcfa06
Binary files /dev/null and b/src/assets/start-sign.png differ
diff --git a/src/components/ButtonDisplayStreak.vue b/src/components/ButtonDisplayStreak.vue
index 053cf6976a755768b3c86cffd0ff7f6883d9f459..97508b39ad9f37d004a51225386cb407b3b0dd8c 100644
--- a/src/components/ButtonDisplayStreak.vue
+++ b/src/components/ButtonDisplayStreak.vue
@@ -25,9 +25,9 @@
}}{{
currentStreak === 1 ? ' utfordring fullført' : ' utfordringer fullført'
}}
- streak</span
+ </span
>
- <p class="text-black text-xs md:text-1xl md:font-bold">
+ <p class="text-black text-xs md:text-1xl md:font-bold my-2">
{{
currentStreak! > 0
? 'Bra jobba du har fullført ' + currentStreak + ' utfordringer på rad!'
diff --git a/src/components/CardChallengeSavingsPath.vue b/src/components/CardChallengeSavingsPath.vue
index cb34ba2490ebcaa4e16a54ec2ac4823e210e4a0e..d42aa442bd1a490a8fa26916f271c141879e268c 100644
--- a/src/components/CardChallengeSavingsPath.vue
+++ b/src/components/CardChallengeSavingsPath.vue
@@ -61,7 +61,7 @@
@click="incrementSaved(challenge)"
:data-cy="'increment-challenge' + challenge.id"
type="button"
- class="inline-block mb-2 ml-2 h-7 w-8 rounded-full p-1 uppercase leading-normal transition duration-150 ease-in-out focus:bg-green-accent-300 focus:shadow-green-2 focus:outline-none focus:ring-0 active:bg-green-600 active:shadow-green-200 motion-reduce:transition-none dark:shadow-black/30 dark:hover:shadow-dark-strong dark:focus:shadow-dark-strong dark:active:shadow-dark-strong"
+ class="text-2xl inline-block mb-2 ml-2 h-7 w-8 rounded-full p-1 uppercase leading-normal transition duration-150 ease-in-out focus:bg-green-accent-300 focus:shadow-green-2 focus:outline-none focus:ring-0 active:bg-green-600 active:shadow-green-200 motion-reduce:transition-none"
>
+
</button>
diff --git a/src/components/FormLogin.vue b/src/components/FormLogin.vue
index e676c6c6fec21252758cd1fe527d2c2985ecc01a..3ae453d84915e9e2dcb2f4802bcd12fb9d967db3 100644
--- a/src/components/FormLogin.vue
+++ b/src/components/FormLogin.vue
@@ -95,7 +95,7 @@ watch(
placeholder="Skriv inn passord"
/>
<button
- class="absolute right-0 top-1 bg-transparent hover:bg-transparent"
+ class="absolute right-0 top-1 bg-transparent hover:bg-transparent mr-4 mt-1"
@click="toggleShowPassword"
>
{{ showPassword ? '🔓' : '🔒' }}
diff --git a/src/components/FormRegister.vue b/src/components/FormRegister.vue
index 2863b6aa8d4f9fd47594ca36b2c5ba33d72bd2cc..56bf3458e483779d053424974c9ae5f78b7ca0cc 100644
--- a/src/components/FormRegister.vue
+++ b/src/components/FormRegister.vue
@@ -129,7 +129,7 @@ watch(
:class="{ 'border-2 border-lime-400': isPasswordValid }"
/>
<button
- class="absolute right-0 top-1 bg-transparent hover:bg-transparent"
+ class="absolute right-0 top-1 bg-transparent hover:bg-transparent mr-4 mt-1"
@click="toggleShowPassword"
>
{{ showPassword ? '🔓' : '🔒' }}
diff --git a/src/components/ImgGifTemplate.vue b/src/components/ImgGifTemplate.vue
index f23f1723afa3e37e176788ddc3c565729e455fa0..23cf21c7bc264d98f124834fded6dcdc8d31ca3a 100644
--- a/src/components/ImgGifTemplate.vue
+++ b/src/components/ImgGifTemplate.vue
@@ -4,7 +4,7 @@
v-if="index % 6 === modValue"
:src="url"
alt="could not load"
- class="min-w-24 w-full h-auto min-h-24 max-w-32 max-h-32 md:min-h-32 md:max-h-44 md:min-w-32 md:max-w-44 border-2 rounded-lg border-stale-400 shadow-md shadow-black"
+ class="min-w-24 w-full h-auto min-h-24 max-w-32 max-h-32 md:min-h-32 md:max-h-44 md:min-w-32 md:max-w-44 rounded-lg border-stale-400 shadow-md shadow-gray-500"
/>
</div>
</template>
diff --git a/src/components/SavingsPath.vue b/src/components/SavingsPath.vue
index ba90e65812ff6047a6fba7f2df80db6b54252812..354e66dc15a3d54bf0ac3424913653d63b803056 100644
--- a/src/components/SavingsPath.vue
+++ b/src/components/SavingsPath.vue
@@ -12,7 +12,7 @@
</div>
<button
v-if="!allChallengesCompleted()"
- class="h-auto w-auto absolute flex text-center self-end mr-10 md:mr-20 text-wrap shadow-sm shadow-black sm:top-50 sm:text-xs sm:mr-20 lg:mr-32 top-60 z-50 p-2 text-xs md:text-sm"
+ class="h-auto w-auto absolute flex text-center self-end mr-10 md:mr-20 text-wrap border-2 border-gray-400 shadow-black sm:top-50 sm:text-xs sm:mr-20 lg:mr-32 top-60 z-50 p-2 text-xs md:text-sm hover:scale-105"
@click="scrollToFirstUncompleted"
v-show="!isAtFirstUncompleted"
>
@@ -22,11 +22,11 @@
<div
v-if="challengesLocal"
ref="containerRef"
- class="container relative pt-6 w-4/5 bg-cover bg-[center] md:[background-position: center;] mx-auto md:w-4/5 no-scrollbar h-full max-h-[60vh] md:max-h-[60vh] md:min-w-2/5 overflow-y-auto border-2 border-transparent rounded-xl bg-white shadow-lg shadow-slate-400"
- style="background-image: url('src/assets/backgroundSavingsPath.png')"
+ class="container relative pt-6 w-4/5 bg-cover bg-[center] md:[background-position: center;] mx-auto md:w-4/5 no-scrollbar h-full max-h-[60vh] md:max-h-[60vh] md:min-w-2/5 overflow-y-auto border-transparent rounded-lg bg-white shadow-md shadow-slate-400"
+ style="background-image: url('src/assets/bakgrunn.png')"
>
<div>
- <img src="@/assets/start.png" alt="Spare" class="md:w-1/6 md:h-auto h-20" />
+ <img src="@/assets/start-sign.png" alt="Spare" class="md:w-1/6 md:h-auto h-20" />
</div>
<div
@@ -107,12 +107,12 @@
<button class="text-2xl ml-10 rounded-full" @click="addSpareUtfordring">
+
</button>
- <p class="">Legg til <br />Spareutfordring</p>
+ <p class="pl-2">Legg til <br />Spareutfordring</p>
</div>
<!-- Finish line -->
</div>
<img
- src="@/assets/finishLine.png"
+ src="@/assets/finishline2.png"
class="w-full max-h-auto mx-auto mt-4"
alt="Finish Line"
/>
diff --git a/src/views/ViewChallengeView.vue b/src/views/ViewChallengeView.vue
index 924d5ae1ab49df8b8b912655fb49b449b835224f..483533e8593d9f239d5e713da16d27c1191b3bb3 100644
--- a/src/views/ViewChallengeView.vue
+++ b/src/views/ViewChallengeView.vue
@@ -104,7 +104,7 @@ const completeChallenge = () => {
<br />
<p>
Du sparer {{ challengeInstance.perPurchase }}kr hver gang du dropper å bruke
- penger på {{ challengeInstance.type }}
+ penger på {{ challengeInstance.title }}
</p>
<div class="justify-center pl-20">
<button
diff --git a/src/views/ViewProfileView.vue b/src/views/ViewProfileView.vue
index 6993e7d21e75ef166287754e724686434d228467..69b076bb5845e1b3efd56588369c36d08823e708 100644
--- a/src/views/ViewProfileView.vue
+++ b/src/views/ViewProfileView.vue
@@ -19,7 +19,6 @@ const updateUser = async () => {
authInterceptor('/profile')
.then((response) => {
profile.value = response.data
- console.log(profile.value)
})
.catch((error) => {
return console.log(error)
@@ -47,6 +46,7 @@ onMounted(async () => {
openSpare()
})
+
const updateBiometrics = async () => {
await useUserStore().bioRegister()
await updateUser()
@@ -54,7 +54,7 @@ const updateBiometrics = async () => {
const openSpare = () => {
speech.value = [
- `Velkommen, ${profile.value?.firstName} ${profile.value?.lastName} !`,
+ `Velkommen, ${profile.value?.firstName} ${profile.value?.lastName}! 🤠`,
'Her kan du finne en oversikt over dine profilinstillinger!',
'Du kan også se dine fullførte sparemål og utfordringer!'
]
@@ -64,8 +64,8 @@ const openSpare = () => {
<template>
<div class="w-full flex px-10 justify-center">
<div class="flex flex-row flex-wrap justify-center w-full max-w-screen-xl gap-20">
- <div class="flex flex-col max-w-96 w-full gap-5">
- <h1>Profile</h1>
+ <div class="flex flex-col max-w-96 w-full gap-5 mt-3">
+ <h1>Din profil</h1>
<div class="flex flex-row gap-5">
<div class="w-32 h-32 border-black border-2 rounded-full shrink-0" />
<div class="w-full flex flex-col justify-between">
@@ -77,7 +77,7 @@ const openSpare = () => {
</div>
</div>
- <h3 class="font-bold" v-text="'Du har spart ' + '< totalSaved >' + 'kr'" />
+ <h3 class="font-bold" v-text="'Du har spart ' + profile?.savedAmount + ' kr totalt'" />
<CardTemplate>
<div class="bg-red-300">
@@ -119,7 +119,10 @@ const openSpare = () => {
></SpareComponent>
<div class="flex flex-row justify-between mx-4">
<p class="font-bold">Fullførte sparemål</p>
- <a class="hover:p-0 cursor-pointer" v-text="'Se alle'" />
+ <a @click="router.push({ name: 'goals' })"
+ class="hover:p-0 cursor-pointer text-blue-500"
+ v-text="'Se alle'"
+ />
</div>
<CardTemplate class="p-4 flex flex-row flex-wrap justify-center gap-2 mb-4 mt-2">
<CardGoal v-for="goal in completedGoals" :key="goal.id" :goal-instance="goal" />
@@ -127,7 +130,10 @@ const openSpare = () => {
<div class="flex flex-row justify-between mx-4">
<p class="font-bold">Fullførte utfordringer</p>
- <a class="hover:p-0 cursor-pointer" v-text="'Se alle'" />
+ <a @click="router.push({ name: 'challenges' })"
+ class="hover:p-0 cursor-pointer text-blue-500"
+ v-text="'Se alle'"
+ />
</div>
<CardTemplate class="p-4 flex flex-row flex-wrap justify-center gap-2 mb-4 mt-2">
<CardGoal