NotFoundView.vue

<template>
  <div class="not-found">
    <div class="nf404">
      <span>404</span>
    </div>
    <a class="button" href="/">Zurück</a>
  </div>
</template>

<style scoped>
@keyframes flash {
  0% {
    background-color: hsl(var(--clr-primary));
  }

  50% {
    background-color: hsl(var(--clr-primary-shade));
  }

  100% {
    background-color: hsl(var(--clr-primary));
  }
}

.not-found {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.nf404 {
  background-color: hsl(var(--clr-primary));
  padding: var(--spacing);
  width: 10em;
  height: 10em;
  animation: flash 1500ms infinite;
}

.nf404>span {
  color: var(--clr-white);
  font-size: 3em;
}
</style>