diff options
Diffstat (limited to 'components')
-rw-r--r-- | components/Footer.vue | 14 | ||||
-rw-r--r-- | components/NavLink.vue (renamed from components/NavLink/index.vue) | 8 | ||||
-rw-r--r-- | components/NavLink/NavLink.test.js | 20 |
3 files changed, 9 insertions, 33 deletions
diff --git a/components/Footer.vue b/components/Footer.vue index 1cdad44..69ea76a 100644 --- a/components/Footer.vue +++ b/components/Footer.vue @@ -2,14 +2,10 @@ <div class="footer" :style="style"> <div class="map"> <div class="routes"> - <router-link v-for="route in routes" :key="route.name" :to="route.path">{{route.name}}</router-link> + <nuxt-link v-for="route in routes" :key="route.name" :to="route.path">{{route.name}}</nuxt-link> </div> <div class="routes"> - <router-link - v-for="route in specialRoutes" - :key="route.name" - :to="route.path" - >{{route.name}}</router-link> + <nuxt-link v-for="route in specialRoutes" :key="route.name" :to="route.path">{{route.name}}</nuxt-link> </div> </div> <div class="space"></div> @@ -34,15 +30,15 @@ export default { specialRoutes: Array, color: { type: String, - default: "#507b34" + default: '#507b34' } }, computed: { style() { - return `background-color: ${this.color}`; + return `background-color: ${this.color}` } } -}; +} </script> <style scoped> diff --git a/components/NavLink/index.vue b/components/NavLink.vue index 8915585..f3a1c6e 100644 --- a/components/NavLink/index.vue +++ b/components/NavLink.vue @@ -1,7 +1,7 @@ <template> <li class="navlink"> <a v-if="external" class="link" target="_blank" rel="”noopener”" :href="link">{{ name }}</a> - <router-link v-else class="link" :to="link">{{ name }}</router-link> + <nuxt-link v-else class="link" :to="link">{{ name }}</nuxt-link> </li> </template> @@ -12,14 +12,14 @@ export default { name: String, external: { type: Boolean, default: false } } -}; +} </script> <style scoped> -@import url("https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap"); +@import url('https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap'); .link { - font-family: "Roboto Slab", serif; + font-family: 'Roboto Slab', serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; diff --git a/components/NavLink/NavLink.test.js b/components/NavLink/NavLink.test.js deleted file mode 100644 index a5da412..0000000 --- a/components/NavLink/NavLink.test.js +++ /dev/null @@ -1,20 +0,0 @@ -import { mount } from '@vue/test-utils'; -import NavLink from './index.vue'; - -describe('NavLink', () => { - // Now mount the component and you have the wrapper - const wrapper = mount(NavLink); - - wrapper.setProps({ link: '/link', name: 'Link' }); - - it('renders the correct markup', () => { - expect(wrapper.html()).toContain(` <li class="navlink"> - <a class="link" href="/link">Link</a> - </li>`); - }); - - // it's also easy to check for the existence of elements - it('has a button', () => { - expect(wrapper.contains('button')).toBe(true); - }); -}); |