diff --git a/.eslintrc.js b/.eslintrc.js
index 3f3df4f..92ce526 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -1,13 +1,17 @@
 module.exports = {
   root: true,
+
   env: {
     node: true
   },
-  extends: ["plugin:vue/essential", "@vue/prettier"],
+
+  extends: ["plugin:vue/recommended", "@vue/prettier"],
+
   rules: {
-    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
-    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off"
+    "no-console": "off",
+    "no-debugger": "off"
   },
+
   parserOptions: {
     parser: "babel-eslint"
   }
diff --git a/package.json b/package.json
index 871172f..a1cf15a 100644
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "get-bored",
+  "name": "bored-app",
   "version": "0.1.0",
   "private": true,
   "scripts": {
@@ -9,10 +9,14 @@
     "test:unit": "vue-cli-service test:unit"
   },
   "dependencies": {
+    "axios": "^0.19.0",
     "core-js": "^2.6.5",
     "vue": "^2.6.10",
     "vue-router": "^3.0.3",
-    "vuex": "^3.0.1"
+    "vue-toasted": "^1.1.27",
+    "vuetify": "^1.5.5",
+    "vuex": "^3.0.1",
+    "vuex-persistedstate": "^2.5.4"
   },
   "devDependencies": {
     "@vue/cli-plugin-babel": "^3.8.0",
@@ -29,7 +33,11 @@
     "lint-staged": "^8.1.5",
     "node-sass": "^4.9.0",
     "sass-loader": "^7.1.0",
-    "vue-template-compiler": "^2.6.10"
+    "stylus": "^0.54.5",
+    "stylus-loader": "^3.0.1",
+    "vue-cli-plugin-vuetify": "^0.5.0",
+    "vue-template-compiler": "^2.6.10",
+    "vuetify-loader": "^1.2.2"
   },
   "gitHooks": {
     "pre-commit": "lint-staged"
diff --git a/public/index.html b/public/index.html
index ae4ab43..12e8830 100644
--- a/public/index.html
+++ b/public/index.html
@@ -6,6 +6,8 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
     <title>get-bored</title>
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.2.0/css/all.css" integrity="sha384-hWVjflwFxL6sNzntih27bfxkr27PmbbK/iSvJ+a4+0owXq79v+lsFkW54bOGbiDQ" crossorigin="anonymous">
   </head>
   <body>
     <noscript>
diff --git a/src/App.vue b/src/App.vue
index 440354e..47fe8f7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,29 +1,28 @@
 <template>
-  <div id="app">
-    <div id="nav">
-      <router-link to="/">Home</router-link> |
-      <router-link to="/about">About</router-link>
-    </div>
-    <router-view />
-  </div>
+  <v-app>
+    <v-toolbar app tabs dense>
+      <v-toolbar-title class="headline text-uppercase">
+        <span>Bored?</span>
+        <span class="font-weight-thin">No more!</span>
+      </v-toolbar-title>
+      <v-spacer></v-spacer>
+      <v-toolbar-items>
+        <v-btn :to="{ name: 'Activity' }" append exact flat>
+          Activity
+        </v-btn>
+        <v-btn :to="{ name: 'Activities' }" append flat>
+          My List
+        </v-btn>
+      </v-toolbar-items>
+    </v-toolbar>
+    <v-content>
+      <router-view />
+    </v-content>
+  </v-app>
 </template>
 
-<style lang="scss">
-#app {
-  font-family: "Avenir", Helvetica, Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  text-align: center;
-  color: #2c3e50;
-}
-#nav {
-  padding: 30px;
-  a {
-    font-weight: bold;
-    color: #2c3e50;
-    &.router-link-exact-active {
-      color: #42b983;
-    }
-  }
-}
-</style>
+<script>
+export default {
+  name: "App"
+};
+</script>
diff --git a/src/api/index.js b/src/api/index.js
new file mode 100644
index 0000000..91914ea
--- /dev/null
+++ b/src/api/index.js
@@ -0,0 +1,17 @@
+import axios from "axios";
+import qs from "qs";
+
+const instance = axios.create({
+  baseURL: "http://www.boredapi.com/api",
+  paramsSerializer: function(params) {
+    return qs.stringify(params, { strictNullHandling: true });
+  }
+});
+
+export default {
+  getActivity(params) {
+    return instance.get("activity", {
+      params: { ...params }
+    });
+  }
+};
diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue
deleted file mode 100644
index 6787bcc..0000000
--- a/src/components/HelloWorld.vue
+++ /dev/null
@@ -1,122 +0,0 @@
-<template>
-  <div class="hello">
-    <h1>{{ msg }}</h1>
-    <p>
-      For a guide and recipes on how to configure / customize this project,<br />
-      check out the
-      <a href="https://cli.vuejs.org" target="_blank" rel="noopener"
-        >vue-cli documentation</a
-      >.
-    </p>
-    <h3>Installed CLI Plugins</h3>
-    <ul>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
-          target="_blank"
-          rel="noopener"
-          >babel</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
-          target="_blank"
-          rel="noopener"
-          >eslint</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-unit-jest"
-          target="_blank"
-          rel="noopener"
-          >unit-jest</a
-        >
-      </li>
-    </ul>
-    <h3>Essential Links</h3>
-    <ul>
-      <li>
-        <a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
-      </li>
-      <li>
-        <a href="https://forum.vuejs.org" target="_blank" rel="noopener"
-          >Forum</a
-        >
-      </li>
-      <li>
-        <a href="https://chat.vuejs.org" target="_blank" rel="noopener"
-          >Community Chat</a
-        >
-      </li>
-      <li>
-        <a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
-          >Twitter</a
-        >
-      </li>
-      <li>
-        <a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
-      </li>
-    </ul>
-    <h3>Ecosystem</h3>
-    <ul>
-      <li>
-        <a href="https://router.vuejs.org" target="_blank" rel="noopener"
-          >vue-router</a
-        >
-      </li>
-      <li>
-        <a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/vue-devtools#vue-devtools"
-          target="_blank"
-          rel="noopener"
-          >vue-devtools</a
-        >
-      </li>
-      <li>
-        <a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
-          >vue-loader</a
-        >
-      </li>
-      <li>
-        <a
-          href="https://github.com/vuejs/awesome-vue"
-          target="_blank"
-          rel="noopener"
-          >awesome-vue</a
-        >
-      </li>
-    </ul>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "HelloWorld",
-  props: {
-    msg: String
-  }
-};
-</script>
-
-<!-- Add "scoped" attribute to limit CSS to this component only -->
-<style scoped lang="scss">
-h3 {
-  margin: 40px 0 0;
-}
-ul {
-  list-style-type: none;
-  padding: 0;
-}
-li {
-  display: inline-block;
-  margin: 0 10px;
-}
-a {
-  color: #42b983;
-}
-</style>
diff --git a/src/main.js b/src/main.js
index 3a47006..3a01f5c 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,8 +1,13 @@
 import Vue from "vue";
+import "./plugins/vuetify";
 import App from "./App.vue";
 import router from "./router";
 import store from "./store";
+import Toasted from "vue-toasted";
 
+Vue.use(Toasted, {
+  duration: 500
+});
 Vue.config.productionTip = false;
 
 new Vue({
diff --git a/src/models/Activity.js b/src/models/Activity.js
new file mode 100644
index 0000000..139f236
--- /dev/null
+++ b/src/models/Activity.js
@@ -0,0 +1,7 @@
+export class Activity {
+  constructor({ type, participants, price } = {}) {
+    this.type = type;
+    this.participants = participants;
+    this.price = price;
+  }
+}
diff --git a/src/plugins/vuetify.js b/src/plugins/vuetify.js
new file mode 100644
index 0000000..c392584
--- /dev/null
+++ b/src/plugins/vuetify.js
@@ -0,0 +1,7 @@
+import Vue from "vue";
+import Vuetify from "vuetify/lib";
+import "vuetify/src/stylus/app.styl";
+
+Vue.use(Vuetify, {
+  iconfont: "fa"
+});
diff --git a/src/router.js b/src/router.js
index 7b4bb79..06537b2 100644
--- a/src/router.js
+++ b/src/router.js
@@ -1,6 +1,5 @@
 import Vue from "vue";
 import Router from "vue-router";
-import Home from "./views/Home.vue";
 
 Vue.use(Router);
 
@@ -10,17 +9,17 @@ export default new Router({
   routes: [
     {
       path: "/",
-      name: "home",
-      component: Home
+      name: "Activity",
+      component: () =>
+        import(/* webpackChunkName: "Activity" */ "@/views/PageActivity")
     },
     {
-      path: "/about",
-      name: "about",
-      // route level code-splitting
-      // this generates a separate chunk (about.[hash].js) for this route
-      // which is lazy-loaded when the route is visited.
+      path: "/list",
+      name: "Activities",
       component: () =>
-        import(/* webpackChunkName: "about" */ "./views/About.vue")
+        import(
+          /* webpackChunkName: "Activities" */ "@/views/PageActivitiesList"
+        )
     }
   ]
 });
diff --git a/src/store.js b/src/store.js
index bb02ce2..c8de1f4 100644
--- a/src/store.js
+++ b/src/store.js
@@ -1,10 +1,46 @@
 import Vue from "vue";
 import Vuex from "vuex";
+import createPersistedState from "vuex-persistedstate";
+import api from "@/api";
 
 Vue.use(Vuex);
 
 export default new Vuex.Store({
-  state: {},
-  mutations: {},
-  actions: {}
+  plugins: [createPersistedState({ paths: ["activitiesList"] })],
+  state: {
+    activity: {},
+    activitiesList: []
+  },
+  mutations: {
+    setActivity(state, activity) {
+      state.activity = activity;
+    },
+    addToList(state) {
+      state.activitiesList.push(state.activity);
+    },
+    removeFromList(state, activity) {
+      state.activitiesList = state.activitiesList.filter(
+        ({ key }) => key !== activity.key
+      );
+    },
+    clearAll(state) {
+      state.activitiesList = [];
+    }
+  },
+  actions: {
+    async loadActivity({ commit }, params = {}) {
+      const { data: activity } = await api.getActivity(params);
+      commit("setActivity", activity);
+    },
+    async saveActivityToList({ state, commit }) {
+      if (
+        state.activitiesList.some(
+          ({ key }) => state.activity.key && key === state.activity.key
+        )
+      ) {
+        return Promise.reject("You already saved this activity");
+      }
+      commit("addToList");
+    }
+  }
 });
diff --git a/src/views/About.vue b/src/views/About.vue
deleted file mode 100644
index 3fa2807..0000000
--- a/src/views/About.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <div class="about">
-    <h1>This is an about page</h1>
-  </div>
-</template>
diff --git a/src/views/Home.vue b/src/views/Home.vue
deleted file mode 100644
index 05494f6..0000000
--- a/src/views/Home.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<template>
-  <div class="home">
-    <img alt="Vue logo" src="../assets/logo.png" />
-    <HelloWorld msg="Welcome to Your Vue.js App" />
-  </div>
-</template>
-
-<script>
-// @ is an alias to /src
-import HelloWorld from "@/components/HelloWorld.vue";
-
-export default {
-  name: "home",
-  components: {
-    HelloWorld
-  }
-};
-</script>
diff --git a/src/views/PageActivitiesList.vue b/src/views/PageActivitiesList.vue
new file mode 100644
index 0000000..e8fa3f5
--- /dev/null
+++ b/src/views/PageActivitiesList.vue
@@ -0,0 +1,67 @@
+<template>
+  <v-layout tag="section" justify-center class="pa-4">
+    <v-flex sm8 md6>
+      <v-card>
+        <v-card-title primary-title>
+          <h3 class="headline">
+            My activities list
+          </h3>
+        </v-card-title>
+        <v-card-text>
+          <v-data-table :headers="headers" :items="activitiesList">
+            <template v-slot:items="{ item }">
+              <td>{{ item.key }}</td>
+              <td>{{ item.activity }}</td>
+              <td>{{ item.participants }}</td>
+              <td>{{ item.price }}</td>
+              <td>
+                <v-btn
+                  icon
+                  color="error"
+                  small
+                  outline
+                  @click="deleteActivity(item)"
+                >
+                  <v-icon>fas fa-minus</v-icon>
+                </v-btn>
+              </td>
+            </template>
+          </v-data-table>
+        </v-card-text>
+        <v-card-actions>
+          <v-btn block color="error" outline @click="clearAll">
+            Clear all
+          </v-btn>
+        </v-card-actions>
+      </v-card>
+    </v-flex>
+  </v-layout>
+</template>
+
+<script>
+import { mapState, mapMutations } from "vuex";
+
+const HEADERS = [
+  { text: "#", align: "left", sortable: false, value: "key" },
+  { text: "Activity", align: "center", sortable: false, value: "activity" },
+  { text: "Participants", value: "participants" },
+  { text: "Budget", value: "price" },
+  { sortable: false }
+];
+
+export default {
+  name: "ActivitiesList",
+  data: () => ({
+    headers: HEADERS
+  }),
+  computed: {
+    ...mapState(["activitiesList"])
+  },
+  methods: {
+    ...mapMutations(["removeFromList", "clearAll"]),
+    deleteActivity(activity) {
+      this.removeFromList(activity);
+    }
+  }
+};
+</script>
diff --git a/src/views/PageActivity.vue b/src/views/PageActivity.vue
new file mode 100644
index 0000000..32dc75a
--- /dev/null
+++ b/src/views/PageActivity.vue
@@ -0,0 +1,125 @@
+<template>
+  <v-layout v-if="activity" tag="section" justify-center class="pa-4">
+    <v-flex sm8 md6>
+      <v-card>
+        <v-card-title primary-title>
+          <h3 class="headline">
+            Activity
+          </h3>
+        </v-card-title>
+        <v-card-text>
+          <v-layout wrap>
+            <v-flex sm6 pa-sm-2 pb-2>
+              <h3 class="subheading">
+                You should:
+              </h3>
+              <v-alert v-if="activity.error" value="true">
+                {{ activity.error }}
+              </v-alert>
+              <div v-else class="headline">
+                {{ activity.activity }}
+              </div>
+            </v-flex>
+            <v-flex sm6 pa-2>
+              <h3 class="subheading">
+                Activity details
+              </h3>
+              <v-form>
+                <v-select
+                  v-model="activityDetails.type"
+                  :items="activityTypes"
+                  label="Type"
+                  clearable
+                ></v-select>
+                <v-text-field
+                  v-model="activityDetails.participants"
+                  data-test="participants"
+                  label="Participants"
+                ></v-text-field>
+                <v-slider
+                  v-model.lazy="activityDetails.price"
+                  min="0"
+                  max="1"
+                  step="0.01"
+                  append-icon="fas fa-coins"
+                  validate-on-blur
+                  prepend-icon="far fa-money-bill-alt"
+                >
+                </v-slider>
+              </v-form>
+            </v-flex>
+          </v-layout>
+        </v-card-text>
+        <v-card-actions>
+          <v-layout text-xs-center wrap>
+            <v-flex sm6>
+              <v-btn data-test="saveToList" color="success" @click="save"
+                >Save to my list</v-btn
+              >
+            </v-flex>
+            <v-flex sm6>
+              <v-btn color="info" @click="getNewActivity">
+                Give me another one
+              </v-btn>
+            </v-flex>
+          </v-layout>
+        </v-card-actions>
+      </v-card>
+    </v-flex>
+  </v-layout>
+</template>
+
+<script>
+import { Activity } from "@/models/Activity";
+import { mapState, mapActions } from "vuex";
+
+const activityTypes = [
+  "education",
+  "recreational",
+  "social",
+  "diy",
+  "charity",
+  "cooking",
+  "relaxation",
+  "music",
+  "busywork"
+];
+
+export default {
+  name: "PageActivity",
+  data: () => ({
+    activityDetails: {},
+    activityTypes
+  }),
+  computed: {
+    ...mapState(["activity"])
+  },
+  watch: {
+    activityDetails: {
+      deep: true,
+      handler(val, oldVal) {
+        if (Object.values(oldVal).every(value => !value)) return;
+        this.loadActivity(val);
+      }
+    }
+  },
+  created() {
+    this.loadActivity().then(() => {
+      this.activityDetails = new Activity(this.activity);
+    });
+  },
+  methods: {
+    ...mapActions(["loadActivity", "saveActivityToList"]),
+    getNewActivity() {
+      this.loadActivity(this.activityDetails);
+    },
+    async save() {
+      try {
+        await this.saveActivityToList();
+      } catch (e) {
+        this.$toasted.error(e);
+      }
+    }
+  }
+};
+</script>
diff --git a/tests/unit/example.spec.js b/tests/unit/example.spec.js
deleted file mode 100644
index a846fbd..0000000
--- a/tests/unit/example.spec.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import { shallowMount } from "@vue/test-utils";
-import HelloWorld from "@/components/HelloWorld.vue";
-
-describe("HelloWorld.vue", () => {
-  it("renders props.msg when passed", () => {
-    const msg = "new message";
-    const wrapper = shallowMount(HelloWorld, {
-      propsData: { msg }
-    });
-    expect(wrapper.text()).toMatch(msg);
-  });
-});
diff --git a/tests/unit/pageActivitiesList.spec.js b/tests/unit/pageActivitiesList.spec.js
new file mode 100644
index 0000000..a9a114c
--- /dev/null
+++ b/tests/unit/pageActivitiesList.spec.js
@@ -0,0 +1,44 @@
+import { shallowMount, createLocalVue } from "@vue/test-utils";
+import Vuex from "vuex";
+import Vuetify from "vuetify";
+import PageActivitiesList from "@/views/PageActivitiesList";
+const localVue = createLocalVue();
+
+const activityMock = {
+  activity: "Learn Express.js",
+  accessibility: 0.25,
+  type: "education",
+  participants: 1,
+  price: 0.1,
+  link: "https://expressjs.com/",
+  key: "3943506"
+};
+
+localVue.use(Vuex);
+localVue.use(Vuetify, {
+  iconfont: "fa"
+});
+
+describe("PageActivitiesList.vue", () => {
+  let actions;
+  let store;
+
+  beforeEach(() => {
+    actions = {
+      loadActivity: jest.fn(),
+      saveActivityToList: jest.fn()
+    };
+    store = new Vuex.Store({
+      state: {
+        activity: activityMock
+      },
+      actions
+    });
+  });
+
+  it("Component renders", () => {
+    const wrapper = shallowMount(PageActivitiesList, { store, localVue });
+
+    expect(wrapper.isVueInstance()).toBe(true);
+  });
+});
diff --git a/tests/unit/pageActivity.spec.js b/tests/unit/pageActivity.spec.js
new file mode 100644
index 0000000..2fc7d6f
--- /dev/null
+++ b/tests/unit/pageActivity.spec.js
@@ -0,0 +1,89 @@
+import { shallowMount, createLocalVue } from "@vue/test-utils";
+import Vuex from "vuex";
+import Vuetify from "vuetify";
+import PageActivity from "@/views/PageActivity";
+import { Activity } from "@/models/Activity";
+const localVue = createLocalVue();
+
+const activityMock = {
+  activity: "Learn Express.js",
+  accessibility: 0.25,
+  type: "education",
+  participants: 1,
+  price: 0.1,
+  link: "https://expressjs.com/",
+  key: "3943506"
+};
+
+localVue.use(Vuex);
+localVue.use(Vuetify, {
+  iconfont: "fa"
+});
+
+describe("PageActivity.vue", () => {
+  let actions;
+  let store;
+
+  beforeEach(() => {
+    actions = {
+      loadActivity: jest.fn(),
+      saveActivityToList: jest.fn()
+    };
+    store = new Vuex.Store({
+      state: {
+        activity: activityMock
+      },
+      actions
+    });
+  });
+
+  it("Component renders", () => {
+    const wrapper = shallowMount(PageActivity, { store, localVue });
+
+    expect(wrapper.isVueInstance()).toBe(true);
+  });
+
+  it("Make call to API endpoint upon creation", () => {
+    shallowMount(PageActivity, { store, localVue });
+
+    expect(actions.loadActivity).toHaveBeenCalled();
+  });
+
+  it("Fill form with received data", async done => {
+    const wrapper = await shallowMount(PageActivity, { store, localVue });
+
+    localVue.nextTick(() => {
+      expect(wrapper.vm.activityDetails).toEqual(new Activity(activityMock));
+      done();
+    });
+  });
+
+  it("Make call to API endpoint after changing form", async done => {
+    const wrapper = await shallowMount(PageActivity, { store, localVue });
+
+    localVue.nextTick(() => {
+      wrapper.vm.activityDetails.participants = 4;
+      done();
+    });
+
+    localVue.nextTick(() => {
+      expect(actions.loadActivity).toHaveBeenCalledTimes(2);
+      done();
+    });
+  });
+
+  it("Saves activity to list", done => {
+    const wrapper = shallowMount(PageActivity, { store, localVue });
+
+    localVue.nextTick(() => {
+      wrapper.find('[data-test="saveToList"]').trigger("click");
+
+      done();
+    });
+
+    localVue.nextTick(() => {
+      expect(actions.saveActivityToList).toHaveBeenCalled();
+      done();
+    });
+  });
+});
diff --git a/vue.config.js b/vue.config.js
new file mode 100644
index 0000000..d44fe88
--- /dev/null
+++ b/vue.config.js
@@ -0,0 +1,3 @@
+module.exports = {
+  productionSourceMap: false
+};
diff --git a/yarn.lock b/yarn.lock
index 7432870..b065ba3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1579,6 +1579,14 @@ aws4@^1.8.0:
   resolved "https://registry.yarnpkg.com/aws4/-/aws4-1.8.0.tgz#f0e003d9ca9e7f59c7a508945d7b2ef9a04a542f"
   integrity sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==
 
+axios@^0.19.0:
+  version "0.19.0"
+  resolved "https://registry.yarnpkg.com/axios/-/axios-0.19.0.tgz#8e09bff3d9122e133f7b8101c8fbdd00ed3d2ab8"
+  integrity sha512-1uvKqKQta3KBxIz14F2v06AEHZ/dIoeKfbTRkK1E5oqjDnuEerLmYTgJB5AiQZHJcljpg1TuRzdjDR06qNk0DQ==
+  dependencies:
+    follow-redirects "1.5.10"
+    is-buffer "^2.0.2"
+
 babel-code-frame@^6.22.0, babel-code-frame@^6.26.0:
   version "6.26.0"
   resolved "https://registry.yarnpkg.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
@@ -2803,6 +2811,11 @@ css-loader@^1.0.1:
     postcss-value-parser "^3.3.0"
     source-list-map "^2.0.0"
 
+css-parse@1.7.x:
+  version "1.7.0"
+  resolved "https://registry.yarnpkg.com/css-parse/-/css-parse-1.7.0.tgz#321f6cf73782a6ff751111390fc05e2c657d8c9b"
+  integrity sha1-Mh9s9zeCpv91ERE5D8BeLGV9jJs=
+
 css-select-base-adapter@^0.1.1:
   version "0.1.1"
   resolved "https://registry.yarnpkg.com/css-select-base-adapter/-/css-select-base-adapter-0.1.1.tgz#3b2ff4972cc362ab88561507a95408a1432135d7"
@@ -3023,6 +3036,13 @@ de-indent@^1.0.2:
   resolved "https://registry.yarnpkg.com/de-indent/-/de-indent-1.0.2.tgz#b2038e846dc33baa5796128d0804b455b8c1e21d"
   integrity sha1-sgOOhG3DO6pXlhKNCAS0VbjB4h0=
 
+debug@*, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1:
+  version "4.1.1"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
+  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
+  dependencies:
+    ms "^2.1.1"
+
 debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   version "2.6.9"
   resolved "https://registry.yarnpkg.com/debug/-/debug-2.6.9.tgz#5d128515df134ff327e90a4c93f4e077a536341f"
@@ -3030,6 +3050,13 @@ debug@2.6.9, debug@^2.2.0, debug@^2.3.3, debug@^2.6.8, debug@^2.6.9:
   dependencies:
     ms "2.0.0"
 
+debug@=3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
+  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
+  dependencies:
+    ms "2.0.0"
+
 debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
   version "3.2.6"
   resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.6.tgz#e83d17de16d8a7efb7717edbe5fb10135eee629b"
@@ -3037,13 +3064,6 @@ debug@^3.1.0, debug@^3.2.5, debug@^3.2.6:
   dependencies:
     ms "^2.1.1"
 
-debug@^4.0.1, debug@^4.1.0, debug@^4.1.1:
-  version "4.1.1"
-  resolved "https://registry.yarnpkg.com/debug/-/debug-4.1.1.tgz#3b72260255109c6b589cee050f1d516139664791"
-  integrity sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==
-  dependencies:
-    ms "^2.1.1"
-
 decamelize@^1.1.1, decamelize@^1.1.2, decamelize@^1.2.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/decamelize/-/decamelize-1.2.0.tgz#f6534d15148269b20352e7bee26f501f9a191290"
@@ -3079,6 +3099,11 @@ deepmerge@^1.5.2:
   resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-1.5.2.tgz#10499d868844cdad4fee0842df8c7f6f0c95a753"
   integrity sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ==
 
+deepmerge@^2.1.0:
+  version "2.2.1"
+  resolved "https://registry.yarnpkg.com/deepmerge/-/deepmerge-2.2.1.tgz#5d3ff22a01c00f645405a2fbc17d0778a1801170"
+  integrity sha512-R9hc1Xa/NOBi9WRVUWg19rl1UB7Tt4kuPd+thNJgFZoxXsTz7ncaPaeIm+40oSGuP33DfMb4sZt1QIGiJzC4EA==
+
 default-gateway@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/default-gateway/-/default-gateway-4.2.0.tgz#167104c7500c2115f6dd69b0a536bb8ed720552b"
@@ -4224,6 +4249,13 @@ fn-name@~2.0.1:
   resolved "https://registry.yarnpkg.com/fn-name/-/fn-name-2.0.1.tgz#5214d7537a4d06a4a301c0cc262feb84188002e7"
   integrity sha1-UhTXU3pNBqSjAcDMJi/rhBiAAuc=
 
+follow-redirects@1.5.10:
+  version "1.5.10"
+  resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.5.10.tgz#7b7a9f9aea2fdff36786a94ff643ed07f4ff5e2a"
+  integrity sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==
+  dependencies:
+    debug "=3.1.0"
+
 follow-redirects@^1.0.0:
   version "1.7.0"
   resolved "https://registry.yarnpkg.com/follow-redirects/-/follow-redirects-1.7.0.tgz#489ebc198dc0e7f64167bd23b03c4c19b5784c76"
@@ -4460,6 +4492,18 @@ glob-to-regexp@^0.3.0:
   resolved "https://registry.yarnpkg.com/glob-to-regexp/-/glob-to-regexp-0.3.0.tgz#8c5a1494d2066c570cc3bfe4496175acc4d502ab"
   integrity sha1-jFoUlNIGbFcMw7/kSWF1rMTVAqs=
 
+glob@7.0.x:
+  version "7.0.6"
+  resolved "https://registry.yarnpkg.com/glob/-/glob-7.0.6.tgz#211bafaf49e525b8cd93260d14ab136152b3f57a"
+  integrity sha1-IRuvr0nlJbjNkyYNFKsTYVKz9Xo=
+  dependencies:
+    fs.realpath "^1.0.0"
+    inflight "^1.0.4"
+    inherits "2"
+    minimatch "^3.0.2"
+    once "^1.3.0"
+    path-is-absolute "^1.0.0"
+
 glob@^7.0.0, glob@^7.0.3, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@~7.1.1:
   version "7.1.4"
   resolved "https://registry.yarnpkg.com/glob/-/glob-7.1.4.tgz#aa608a2f6c577ad357e1ae5a5c26d9a8d1969255"
@@ -5125,6 +5169,11 @@ is-buffer@^1.1.5:
   resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-1.1.6.tgz#efaa2ea9daa0d7ab2ea13a97b2b8ad51fefbe8be"
   integrity sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==
 
+is-buffer@^2.0.2:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/is-buffer/-/is-buffer-2.0.3.tgz#4ecf3fcf749cbd1e472689e109ac66261a25e725"
+  integrity sha512-U15Q7MXTuZlrbymiz95PJpZxu8IlipAp4dtS3wOdgPXx3mqBnslrWU14kxfHB+Py/+2PVKSr37dMAgM2A4uArw==
+
 is-callable@^1.1.4:
   version "1.1.4"
   resolved "https://registry.yarnpkg.com/is-callable/-/is-callable-1.1.4.tgz#1e1adf219e1eeb684d691f9d6a05ff0d30a24d75"
@@ -6263,6 +6312,11 @@ locate-path@^3.0.0:
     p-locate "^3.0.0"
     path-exists "^3.0.0"
 
+lodash.clonedeep@^4.5.0:
+  version "4.5.0"
+  resolved "https://registry.yarnpkg.com/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz#e23f3f9c4f8fbdde872529c1071857a086e5ccef"
+  integrity sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=
+
 lodash.defaultsdeep@^4.6.0:
   version "4.6.0"
   resolved "https://registry.yarnpkg.com/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.0.tgz#bec1024f85b1bd96cbea405b23c14ad6443a6f81"
@@ -8681,6 +8735,11 @@ sass-loader@^7.1.0:
     pify "^3.0.0"
     semver "^5.5.0"
 
+sax@0.5.x:
+  version "0.5.8"
+  resolved "https://registry.yarnpkg.com/sax/-/sax-0.5.8.tgz#d472db228eb331c2506b0e8c15524adb939d12c1"
+  integrity sha1-1HLbIo6zMcJQaw6MFVJK25OdEsE=
+
 sax@^1.2.4, sax@~1.2.4:
   version "1.2.4"
   resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
@@ -8864,6 +8923,11 @@ shellwords@^0.1.1:
   resolved "https://registry.yarnpkg.com/shellwords/-/shellwords-0.1.1.tgz#d6b9181c1a48d397324c84871efbcfc73fc0654b"
   integrity sha512-vFwSUfQvqybiICwZY5+DAWIPLKsWO31Q91JSKl3UYv+K5c2QRPzn0qzec6QPu1Qc9eHYItiP3NdJqNVqetYAww==
 
+shvl@^1.3.0:
+  version "1.3.1"
+  resolved "https://registry.yarnpkg.com/shvl/-/shvl-1.3.1.tgz#6c20a17b4a20b08e9f8cab60c50a92229fcc176e"
+  integrity sha512-+rRPP46hloYUAEImJcqprUgXu+05Ikqr4h4V+w5i2zJy37nAqtkQKufs3+3S2fDq6JNRrHMIQhB/Vaex+jgAAw==
+
 sigmund@^1.0.1:
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/sigmund/-/sigmund-1.0.1.tgz#3ff21f198cad2175f9f3b781853fd94d0d19b590"
@@ -9017,6 +9081,13 @@ source-map-url@^0.4.0:
   resolved "https://registry.yarnpkg.com/source-map-url/-/source-map-url-0.4.0.tgz#3e935d7ddd73631b97659956d55128e87b5084a3"
   integrity sha1-PpNdfd1zYxuXZZlW1VEo6HtQhKM=
 
+source-map@0.1.x:
+  version "0.1.43"
+  resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.1.43.tgz#c24bc146ca517c1471f5dacbe2571b2b7f9e3346"
+  integrity sha1-wkvBRspRfBRx9drL4lcbK3+eM0Y=
+  dependencies:
+    amdefine ">=0.0.4"
+
 source-map@^0.4.2:
   version "0.4.4"
   resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.4.4.tgz#eba4f5da9c0dc999de68032d8b4f76173652036b"
@@ -9350,6 +9421,27 @@ stylehacks@^4.0.0:
     postcss "^7.0.0"
     postcss-selector-parser "^3.0.0"
 
+stylus-loader@^3.0.1:
+  version "3.0.2"
+  resolved "https://registry.yarnpkg.com/stylus-loader/-/stylus-loader-3.0.2.tgz#27a706420b05a38e038e7cacb153578d450513c6"
+  integrity sha512-+VomPdZ6a0razP+zinir61yZgpw2NfljeSsdUF5kJuEzlo3khXhY19Fn6l8QQz1GRJGtMCo8nG5C04ePyV7SUA==
+  dependencies:
+    loader-utils "^1.0.2"
+    lodash.clonedeep "^4.5.0"
+    when "~3.6.x"
+
+stylus@^0.54.5:
+  version "0.54.5"
+  resolved "https://registry.yarnpkg.com/stylus/-/stylus-0.54.5.tgz#42b9560931ca7090ce8515a798ba9e6aa3d6dc79"
+  integrity sha1-QrlWCTHKcJDOhRWnmLqeaqPW3Hk=
+  dependencies:
+    css-parse "1.7.x"
+    debug "*"
+    glob "7.0.x"
+    mkdirp "0.5.x"
+    sax "0.5.x"
+    source-map "0.1.x"
+
 supports-color@^2.0.0:
   version "2.0.0"
   resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
@@ -9955,6 +10047,11 @@ vm-browserify@^1.0.1:
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.0.tgz#bd76d6a23323e2ca8ffa12028dc04559c75f9019"
   integrity sha512-iq+S7vZJE60yejDYM0ek6zg308+UZsdtPExWP9VZoCFCz1zkJoXFnAX7aZfd/ZwrkidzdUZL0C/ryW+JwAiIGw==
 
+vue-cli-plugin-vuetify@^0.5.0:
+  version "0.5.0"
+  resolved "https://registry.yarnpkg.com/vue-cli-plugin-vuetify/-/vue-cli-plugin-vuetify-0.5.0.tgz#14c9a61884da58cf6aaf8ff3309044931907f184"
+  integrity sha512-TigfiZUs7SN3Z6uxKilqJUtYxte8vp0F4QxabCli6hkKPqU97JzAZc3P7AL6omkRAd2DMI26fOrIGjuALTvXww==
+
 vue-eslint-parser@^2.0.3:
   version "2.0.3"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-2.0.3.tgz#c268c96c6d94cfe3d938a5f7593959b0ca3360d1"
@@ -10012,9 +10109,9 @@ vue-loader@^15.7.0:
     vue-style-loader "^4.1.0"
 
 vue-router@^3.0.3:
-  version "3.0.6"
-  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.0.6.tgz#2e4f0f9cbb0b96d0205ab2690cfe588935136ac3"
-  integrity sha512-Ox0ciFLswtSGRTHYhGvx2L44sVbTPNS+uD2kRISuo8B39Y79rOo0Kw0hzupTmiVtftQYCZl87mwldhh2L9Aquw==
+  version "3.0.7"
+  resolved "https://registry.yarnpkg.com/vue-router/-/vue-router-3.0.7.tgz#b36ca107b4acb8ff5bc4ff824584059c23fcb87b"
+  integrity sha512-utJ+QR3YlIC/6x6xq17UMXeAfxEvXA0VKD3PiSio7hBOZNusA1jXcbxZxVEfJunLp48oonjTepY8ORoIlRx/EQ==
 
 vue-style-loader@^4.1.0:
   version "4.1.2"
@@ -10037,11 +10134,36 @@ vue-template-es2015-compiler@^1.6.0, vue-template-es2015-compiler@^1.9.0:
   resolved "https://registry.yarnpkg.com/vue-template-es2015-compiler/-/vue-template-es2015-compiler-1.9.1.tgz#1ee3bc9a16ecbf5118be334bb15f9c46f82f5825"
   integrity sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==
 
+vue-toasted@^1.1.27:
+  version "1.1.27"
+  resolved "https://registry.yarnpkg.com/vue-toasted/-/vue-toasted-1.1.27.tgz#ce0a74b875f90c2e4a9e163cce6d5fc37d78a07c"
+  integrity sha512-GVbwInwnqkVxQ4GU/XYeQt1e0dAXL8sF5Hr1H/coCBbYUan5xP0G2mEz/HRDf1lt73rFQAN/bJcLTOKkqiM6tg==
+
 vue@^2.6.10:
   version "2.6.10"
   resolved "https://registry.yarnpkg.com/vue/-/vue-2.6.10.tgz#a72b1a42a4d82a721ea438d1b6bf55e66195c637"
   integrity sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ==
 
+vuetify-loader@^1.2.2:
+  version "1.2.2"
+  resolved "https://registry.yarnpkg.com/vuetify-loader/-/vuetify-loader-1.2.2.tgz#7c221dcfd8482344518818d598f9cef8ddd85b6b"
+  integrity sha512-j6KWPuwQ4xTxPDksbFwbSJle7+3oSjNvJ/CViTEgbPLFPqnNsR8JUtRldURIQ0cmAmr0/CoLSZkj0B8JKqOBMA==
+  dependencies:
+    loader-utils "^1.1.0"
+
+vuetify@^1.5.5:
+  version "1.5.16"
+  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-1.5.16.tgz#cc9d0199c389d64d15787ddc85ca47a28225eeee"
+  integrity sha512-yBgOsfurKQkeS+l+rrTQZ2bFk0D9ezjHhkuVM5A/yVzcg62sY2nfYaq/H++uezBWC9WYFrp/5OmSocJQcWn9Qw==
+
+vuex-persistedstate@^2.5.4:
+  version "2.5.4"
+  resolved "https://registry.yarnpkg.com/vuex-persistedstate/-/vuex-persistedstate-2.5.4.tgz#a19710ad7f9a08cea4e65fc585924d9fdac7384a"
+  integrity sha512-XYJhKIwO+ZVlTaXyxKxnplrJ88Fnvk5aDw753bxzRw5/yMKLQ6lq9CDCBex2fwZaQcLibhtgJOxGCHjy9GLSlQ==
+  dependencies:
+    deepmerge "^2.1.0"
+    shvl "^1.3.0"
+
 vuex@^3.0.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/vuex/-/vuex-3.1.1.tgz#0c264bfe30cdbccf96ab9db3177d211828a5910e"
@@ -10268,6 +10390,11 @@ whatwg-url@^7.0.0:
     tr46 "^1.0.1"
     webidl-conversions "^4.0.2"
 
+when@~3.6.x:
+  version "3.6.4"
+  resolved "https://registry.yarnpkg.com/when/-/when-3.6.4.tgz#473b517ec159e2b85005497a13983f095412e34e"
+  integrity sha1-RztRfsFZ4rhQBUl6E5g/CVQS404=
+
 which-module@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/which-module/-/which-module-1.0.0.tgz#bba63ca861948994ff307736089e3b96026c2a4f"
