diff --git a/src/assets/items/pigcoin.png b/src/assets/items/pigcoin.png
new file mode 100644
index 0000000000000000000000000000000000000000..302e7e190ca30d4868094fb733fc1b8f2a438a55
Binary files /dev/null and b/src/assets/items/pigcoin.png differ
diff --git a/src/components/Buttons/ShopButton.vue b/src/components/Buttons/ShopButton.vue
index 4e28fcdb6e68eb87602d970bd0d612a46270668d..4ed5e02632d891b47f6752b8e870987b3e178edc 100644
--- a/src/components/Buttons/ShopButton.vue
+++ b/src/components/Buttons/ShopButton.vue
@@ -1,5 +1,5 @@
<template>
- <button type="button" class="btn btn-primary" id="buttonStyle"><img src="@/assets/items/v-buck.png" style="width: 2rem"> +{{ buttonText }}</button>
+ <button type="button" class="btn btn-primary" id="buttonStyle"><img src="@/assets/items/pigcoin.png" style="width: 2rem"> +{{ buttonText }}</button>
</template>
<script>
diff --git a/src/components/Login/Login.vue b/src/components/Login/Login.vue
index 25469a19d2cbd3c352545218fe480114ae8c6181..834e1b7e7e3c7c62076dbfdb0c3897abc3f1daaa 100644
--- a/src/components/Login/Login.vue
+++ b/src/components/Login/Login.vue
@@ -3,11 +3,29 @@ import LoginForm from '@/components/Login/LoginForm.vue'
</script>
<template>
- <div class="container-fluid">
- <LoginForm/>
+ <div class="containers">
+ <div class="box">
+ <LoginForm/>
+ </div>
</div>
</template>
-<style>
+<style scoped>
+ .containers {
+ background-color: #A2CC99;
+ height: 100vh;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+ .box {
+ background-color: white;
+ border-radius: 3rem;
+ max-width: 450px;
+ padding: 1rem 4rem;
+ box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
+ }
+
+
</style>
\ No newline at end of file
diff --git a/src/components/SignUp/SignUp.vue b/src/components/SignUp/SignUp.vue
index 4dff39dcd4bbe2a47e1471473d7a1632eb540827..eb272c6f1966c45c9d61045a1375fc8dcfb14981 100644
--- a/src/components/SignUp/SignUp.vue
+++ b/src/components/SignUp/SignUp.vue
@@ -4,9 +4,27 @@ import SignUpForm from '@/components/SignUp/SignUpForm.vue'
</script>
<template>
- <SignUpForm/>
+ <div class="containers">
+ <div class="box">
+ <SignUpForm />
+ </div>
+ </div>
</template>
<style scoped>
+.containers {
+ background-color: #A2CC99;
+ height: 100vh;
+ display: flex;
+ justify-content: center;
+}
+.box {
+ width: 450px;
+ margin: 2rem;
+ background-color: white;
+ border-radius: 3rem;
+ padding: 1rem 4rem;
+ box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
+}
</style>
\ No newline at end of file
diff --git a/src/components/SignUp/SignUpForm.vue b/src/components/SignUp/SignUpForm.vue
index dad760e62b52dab00c22e31e5c63dba26ad0c0bb..b0b04ad2309aeaa1c82d1d86e651838a98decc68 100644
--- a/src/components/SignUp/SignUpForm.vue
+++ b/src/components/SignUp/SignUpForm.vue
@@ -68,6 +68,7 @@ const handleSubmit = async () => {
<template>
<div class="container">
+ <img src="@/assets/Sparesti-logo.png" style="width: 120px">
<form ref="formRef" id="signUpForm" @submit.prevent="handleSubmit" novalidate>
<BaseInput :model-value=firstNameRef
@input-change-event="handleFirstNameInputEvent"
@@ -124,12 +125,17 @@ const handleSubmit = async () => {
.container {
max-width: 450px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
}
#signUpForm {
display: flex;
flex-direction: column;
justify-items: center;
+ width: 100%;
}
#firstNameInput, #surnameInput, #emailInput, #passwordInput, #confirmButton, #confirmPasswordInput {
diff --git a/src/views/Authentication/ChangePasswordView.vue b/src/views/Authentication/ChangePasswordView.vue
index f4f4dc6dea62fd54eccfb470c54717279f690c11..36e2e75e365f0f9bb01d81155533be0fa48e2ec0 100644
--- a/src/views/Authentication/ChangePasswordView.vue
+++ b/src/views/Authentication/ChangePasswordView.vue
@@ -1,5 +1,5 @@
<template>
- <div class="container">
+ <div class="containers">
<div class="row justify-content-center">
<div class="col-lg-5">
<div class="card shadow-lg border-0 rounded-lg mt-5">
@@ -70,4 +70,17 @@ const submitForm = async () => {
}
};
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+ .containers {
+ width: 100%;
+ background-color: #A2CC99;
+ height: 100vh;
+ }
+
+ .row {
+ margin-right: 0px;
+ margin-left: 0px;
+ }
+</style>
\ No newline at end of file
diff --git a/src/views/Authentication/ForgottenPasswordView.vue b/src/views/Authentication/ForgottenPasswordView.vue
index e43e961e8a0ec3c391562cc2c3ced3def1cb1315..07501b6f6593a120c171fc99bc72a7bbf0bfe893 100644
--- a/src/views/Authentication/ForgottenPasswordView.vue
+++ b/src/views/Authentication/ForgottenPasswordView.vue
@@ -1,5 +1,5 @@
<template>
- <div class="container">
+ <div class="containers">
<div class="row justify-content-center">
<div class="col-lg-5">
<div class="card shadow-lg border-0 rounded-lg mt-5">
@@ -56,4 +56,17 @@ const submitForm = async () => {
}
};
-</script>
\ No newline at end of file
+</script>
+
+<style scoped>
+ .containers {
+ width: 100%;
+ background-color: #A2CC99;
+ height: 100vh;
+ }
+
+ .row {
+ margin-right: 0px;
+ margin-left: 0px;
+ }
+</style>
\ No newline at end of file
diff --git a/src/views/LeaderboardView.vue b/src/views/LeaderboardView.vue
index 785fce3f7d8cd55a936b00ba4519674d82f3b7e4..16b4ae404a28b1fa484d981980f072ce8fa8824d 100644
--- a/src/views/LeaderboardView.vue
+++ b/src/views/LeaderboardView.vue
@@ -17,7 +17,7 @@
</div>
<main>
<div id="leaderboard">
- <h1><img src="@/assets/items/v-buck.png" style="width: 2rem"> Total points</h1>
+ <h1><img src="@/assets/items/pigcoin.png" style="width: 3rem"> Total points</h1>
<Leaderboard :leaderboard="pointsLeaderboardData" :leaderboardExtra="pointsLeaderboardDataExtra" @navigateToUserProfile="navigateToUserProfile" />
</div>
<div id="leaderboard">
@@ -97,8 +97,6 @@ async function global() {
pointsLeaderboardDataExtra.value = globalPointsYou.entries;
currentLeaderboardDataExtra.value = globalCurrentStreakYou.entries;
streakLeaderboardDataExtra.value = globalStreakYou.entries;
-
- console.log(pointsLeaderboardDataExtra.value);
}
async function friends() {
@@ -138,8 +136,6 @@ async function friends() {
pointsLeaderboardDataExtra.value = friendsPointsYou.entries;
currentLeaderboardDataExtra.value = friendsStreakYou.entries;
streakLeaderboardDataExtra.value = friendsCurrentStreakYou.entries;
-
-
}
const navigateToUserProfile = (userId: number) => {
@@ -170,7 +166,6 @@ main {
#content {
display: flex;
flex-direction: row;
-
justify-content: center;
flex-wrap: wrap;
}
@@ -188,7 +183,6 @@ h1 {
display: flex;
justify-content: center;
margin-bottom: 2rem;
-
}
#radioContainer {
diff --git a/src/views/ShopView.vue b/src/views/ShopView.vue
index 2bf2eafe93dff64150ce1365535defa33e28fa01..86c22ee13bdac2ab935a2bb0dce6c1712aeab55d 100644
--- a/src/views/ShopView.vue
+++ b/src/views/ShopView.vue
@@ -73,14 +73,14 @@
<img src="@/assets/items/adfree.png" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Adfree</h5>
- <ShopButton button-text="35kr"></ShopButton>
+ <button type="button" class="btn btn-primary" id="buttonStyle"> +35kr</button>
</div>
</div>
<div class="card text-center" style="width: 16rem; border: none">
<img src="@/assets/items/piggybank.webp" class="card-img-top" alt="...">
<div class="card-body">
<h5 class="card-title">Premium</h5>
- <ShopButton button-text="50kr"></ShopButton>
+ <button type="button" class="btn btn-primary" id="buttonStyle">+50kr</button>
</div>
</div>
</div>