diff --git a/src/App.vue b/src/App.vue index 6a65bcc1751df8669f08f543a3831f2065dbd7aa..82f2495115532cd05cde1f704cc00cb0e3db43c8 100644 --- a/src/App.vue +++ b/src/App.vue @@ -6,25 +6,4 @@ <router-view /> </template> -<style> -#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; -} - -#nav a { - font-weight: bold; - color: #2c3e50; -} - -#nav a.router-link-exact-active { - color: #42b983; -} -</style> +<style></style> diff --git a/src/assets/logo.png b/src/assets/logo.png deleted file mode 100644 index f3d2503fc2a44b5053b0837ebea6e87a2d339a43..0000000000000000000000000000000000000000 Binary files a/src/assets/logo.png and /dev/null differ diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue deleted file mode 100644 index 7c23e3659ea38f7d95982387a37cf3f6a63976b5..0000000000000000000000000000000000000000 --- a/src/components/HelloWorld.vue +++ /dev/null @@ -1,130 +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-router" - target="_blank" - rel="noopener" - >router</a - > - </li> - <li> - <a - href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-vuex" - target="_blank" - rel="noopener" - >vuex</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> - </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> -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/components/SampleComponent.vue b/src/components/SampleComponent.vue new file mode 100644 index 0000000000000000000000000000000000000000..bf4199c00dd4ced17e77d999e2dfe023b87d7701 --- /dev/null +++ b/src/components/SampleComponent.vue @@ -0,0 +1,14 @@ +<template> + <div class="hello"> + <p>Something</p> + </div> +</template> + +<script> +export default { + name: "SampleComponent", +}; +</script> + +<!-- Add "scoped" attribute to limit CSS to this component only --> +<style scoped></style> diff --git a/src/views/Home.vue b/src/views/Home.vue index 8f4339d311eadc3134c8e011d062209792e7c7af..50a02b0ae1eb9b82a50a8b2980bf3498ff1cf445 100644 --- a/src/views/Home.vue +++ b/src/views/Home.vue @@ -1,18 +1,17 @@ <template> <div class="home"> - <img alt="Vue logo" src="../assets/logo.png" /> - <HelloWorld msg="Welcome to Your Vue.js App" /> + <SampleComponent /> </div> </template> <script> // @ is an alias to /src -import HelloWorld from "@/components/HelloWorld.vue"; +import SampleComponent from "@/components/SampleComponent.vue"; export default { name: "Home", components: { - HelloWorld, + SampleComponent, }, }; </script>