sider and frame done

src/views/Collection.vue

@@ -0,0 +1,8 @@
+<template>
+  <Row class="collection">collection</Row>
+</template>
+<script>
+export default {
+  name: 'collection'
+}
+</script>

src/views/List.vue

@@ -0,0 +1,10 @@
+<template>
+  <Row>
+    <div class="list">list</div>
+  </Row>
+</template>
+<script>
+export default {
+  name: 'list'
+}
+</script>

src/views/Player.vue

@@ -1,8 +1,8 @@
 <template>
-  <div class="home">home</div>
+  <Row class="player">player</Row>
 </template>
 <script>
 export default {
-  name: 'home'
+  name: 'player'
 }
 </script>

src/views/Search.vue

@@ -2,12 +2,12 @@
   <div class="search">search</div>
 </template>
 <script>
-import video from '@/util/util.video'
+// import video from '@/util/util.video'
 export default {
   name: 'search',
   methods: {},
   created () {
-    video.init()
+    // video.init()
   }
 }
 </script>

src/views/Settings.vue

@@ -0,0 +1,16 @@
+<template>
+  <Row>
+    <Button type="primary" @click="switchTheme('light')">light</Button>
+    <Button type="primary" @click="switchTheme('dark')">Dark</Button>
+  </Row>
+</template>
+<script>
+export default {
+  name: 'settings',
+  methods: {
+    switchTheme (e) {
+      this.$store.commit('SET_THEME', e)
+    }
+  }
+}
+</script>