Added proper homepage.

This commit is contained in:
neviyn 2018-10-09 13:29:53 +01:00
parent bbfa00e3a1
commit f09dd79754
3 changed files with 48 additions and 1 deletions

View File

@ -19,12 +19,13 @@
</b-collapse>
</b-navbar>
<br/>
<transition>
<transition name="fade" mode="out-in" appear>
<router-view/>
</transition>
</div>
</template>
<!--suppress CssUnusedSymbol -->
<style>
#app {
font-family: "Avenir", Helvetica, Arial, sans-serif;
@ -33,4 +34,10 @@
text-align: center;
color: #2c3e50;
}
.fade-enter-active, .fade-leave-active {
transition: opacity .5s;
}
.fade-enter, .fade-leave-to /* .fade-leave-active below version 2.1.8 */ {
opacity: 0;
}
</style>

View File

@ -1,5 +1,6 @@
import Vue from "vue";
import Router from "vue-router";
import Home from "./views/Home.vue";
import StartNew from "./views/StartNew.vue";
import Observation from "./views/Observation.vue";
import Stats from "./views/Stats.vue";
@ -12,6 +13,11 @@ Vue.use(Router);
export default new Router({
routes: [
{
path: "/",
name: "home",
component: Home
},
{
path: "/new",
name: "startnew",

View File

@ -0,0 +1,34 @@
<template>
<b-container>
<b-row>
<b-col>
<h1>Training Observations Database</h1>
</b-col>
</b-row>
<b-row class="my-3">
<b-col>
<b-button size="lg" to="/new">Start a new observation</b-button>
</b-col>
</b-row>
<b-row class="my-3">
<b-col>
<b-button size="lg" to="/observations">Read past observations</b-button>
</b-col>
</b-row>
<b-row class="my-3">
<b-col>
<b-button size="lg" to="/stats">View daily observation statistics</b-button>
</b-col>
</b-row>
</b-container>
</template>
<script>
export default {
name: "Home"
}
</script>
<style scoped>
</style>