Skip to content

Commit

Permalink
✨ feat: Add not-found page
Browse files Browse the repository at this point in the history
Signed-off-by: sqrtthree <[email protected]>
  • Loading branch information
linhe0x0 committed Jul 25, 2018
1 parent acbf44a commit a3ff4ac
Showing 1 changed file with 55 additions and 0 deletions.
55 changes: 55 additions & 0 deletions NotFound.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<template>
<div class="container notfound-page">
<div class="content">
<h1>Not Found</h1>
<p>{{ getMsg() }}</p>
<router-link to="/">Take me home.</router-link>
</div>
</div>
</template>

<script>
const msgs = [
`There's nothing here.`,
`How did we get here?`,
`That's a Four-Oh-Four.`,
`Looks like we've got some broken links.`,
`Please try your request again or contact support.`,
]
export default {
methods: {
getMsg() {
return msgs[Math.floor(Math.random() * msgs.length)]
},
},
}
</script>

<style lang="stylus" scoped>
.notfound-page
display: flex
align-items: center
justify-content: center
height: 100vh
text-align: center
.content
display: flex
align-items: center
margin-bottom: 24px
h1
margin-bottom: 0
font-size: 20px
font-weight: 500
&::after
margin: 0 10px
content: "·"
p
margin: 0
margin-right: 10px;
font-size: 14px
</style>

0 comments on commit a3ff4ac

Please sign in to comment.