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-collapse>
</b-navbar> </b-navbar>
<br/> <br/>
<transition> <transition name="fade" mode="out-in" appear>
<router-view/> <router-view/>
</transition> </transition>
</div> </div>
</template> </template>
<!--suppress CssUnusedSymbol -->
<style> <style>
#app { #app {
font-family: "Avenir", Helvetica, Arial, sans-serif; font-family: "Avenir", Helvetica, Arial, sans-serif;
@ -33,4 +34,10 @@
text-align: center; text-align: center;
color: #2c3e50; 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> </style>

View File

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