From 3c3dd262c6f9f03d65519d569965a4b61c8048ec Mon Sep 17 00:00:00 2001
From: vekaste <vekaste@stud.ntnu.no>
Date: Thu, 18 Apr 2024 11:51:36 +0200
Subject: [PATCH] feat: Created a component for creation of a new saving goal
---
.../SavingGoalComponents/SavingGoalCreate.vue | 44 +++++++++++++++++++
1 file changed, 44 insertions(+)
create mode 100644 src/components/SavingGoalComponents/SavingGoalCreate.vue
diff --git a/src/components/SavingGoalComponents/SavingGoalCreate.vue b/src/components/SavingGoalComponents/SavingGoalCreate.vue
new file mode 100644
index 0000000..b23db87
--- /dev/null
+++ b/src/components/SavingGoalComponents/SavingGoalCreate.vue
@@ -0,0 +1,44 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+ <div class="col-lg-8">
+ <h1>Create a new saving goal!</h1>
+ <br>
+ <p>Create a name for this saving goal: </p>
+ <div class="input-group mb-3">
+ <span class="input-group-text" id="basic-addon1">Name:</span>
+ <input type="text" class="form-control" placeholder="Name of Saving Goal" aria-label="Username" aria-describedby="basic-addon1">
+ </div>
+
+ <p>Add a description to this saving goal: </p>
+ <div class="input-group mb-3">
+ <span class="input-group-text" id="basic-addon2">Description:</span>
+ <textarea class="form-control" aria-label="With textarea"></textarea>
+ </div>
+
+ <!--Change this to date picker?-->
+ <p>How long should this saving goal last: </p>
+ <div class="input-group mb-3">
+ <input type="text" class="form-control" aria-label="Amount of days" placeholder="Amount of days (as number)">
+ <span class="input-group-text">Days</span>
+ </div>
+
+ <p>How much do you want to save during this saving goal: </p>
+ <div class="input-group">
+ <input type="text" class="form-control" aria-label="" placeholder="NOK (as number)">
+ <span class="input-group-text">NOK</span>
+ </div>
+
+ <br>
+ <button class="btn btn-primary btn-lg">Create goal!</button>
+ </div>
+</template>
+
+<style scoped>
+.col-lg-8 {
+ width: 63%;
+ margin-top: 50px;
+}
+</style>
\ No newline at end of file
--
GitLab