adding details
This commit is contained in:
25
frontend/src/views/NotFoundView.vue
Normal file
25
frontend/src/views/NotFoundView.vue
Normal file
@@ -0,0 +1,25 @@
|
||||
<script setup>
|
||||
import { RouterLink } from 'vue-router'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<section class="section nf">
|
||||
<div class="container nf__inner">
|
||||
<span class="mono dim">ERR · 404</span>
|
||||
<h1>Lost in orbit.</h1>
|
||||
<p class="muted">The page you're looking for has drifted. Let's get you back.</p>
|
||||
<div class="nf__cta">
|
||||
<RouterLink to="/" class="btn btn--primary">Home</RouterLink>
|
||||
<RouterLink to="/products" class="btn btn--ghost">Products</RouterLink>
|
||||
<RouterLink to="/contact" class="btn btn--ghost">Talk to us</RouterLink>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.nf { min-height: 60vh; display: flex; align-items: center; }
|
||||
.nf__inner { text-align: center; max-width: 560px; margin: 0 auto; }
|
||||
.nf h1 { margin-top: var(--space-3); font-size: clamp(2.5rem, 7vw, 4.5rem); }
|
||||
.nf__cta { display: flex; gap: var(--space-3); justify-content: center; flex-wrap: wrap; margin-top: var(--space-5); }
|
||||
</style>
|
||||
Reference in New Issue
Block a user