finished home page

2023-11-09 22:05:32 +01:00
parent 49e5b6da73
commit f82cf089b6
6 changed files with 182 additions and 21 deletions
--- a/components/Dashboard.vue
+++ b/components/Dashboard.vue
@ -0,0 +1,78 @@
+<template>
+  <section class="dashboard">
+    <h2 class="heading">My tasks</h2>
+    <div class="shortcuts">
+      <input type="button" id="maintenance-visits" value="My Maintenance Visits">
+      <input type="button" id="production-orders" value="My Production Orders">
+      <input type="button" id="solutions" value="My Solutions">
+      <input type="button" id="issue-slips" value="My Issue Slips">
+    </div>
+  </section>
+</template>
+
+
+
+<script>
+
+export default {
+  name: "Dashboard",
+  
+}
+
+</script>
+
+  
+  
+  
+<style scoped>
+  
+  .dashboard {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: center;
+    align-self: stretch;
+    width: 100%;
+    padding: 30px 50px 50px;
+    gap: 20px;
+    border-radius: 10px;
+    box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
+    background-color: #2c2c2c;
+  }
+  
+  .heading {
+    color: #fff;
+    letter-spacing: 0.8px;
+    text-decoration-line: underline;
+    font: 400 16px/32px Overpass, sans-serif;
+  }
+  
+  .shortcuts {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    align-content: center;
+    padding: 10px 40px;
+    gap: 40px;
+  }
+  
+  input {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: center;
+    width: 240px;
+    height: 64px;
+    border-radius: 10px;
+    padding: 15px 20px;
+    border: none;
+    color: #fff;
+    text-align: center;
+    letter-spacing: 0.7px;
+    font: 400 14px/32px Overpass, sans-serif;
+    background-color: #343434;
+  }
+  
+  
+  
+</style>