37 lines
1.0 KiB
Vue
37 lines
1.0 KiB
Vue
<script setup lang="ts">
|
|
interface Props {
|
|
code?: string;
|
|
title?: string;
|
|
message?: string;
|
|
}
|
|
|
|
withDefaults(defineProps<Props>(), {
|
|
code: "500",
|
|
title: "Something went wrong",
|
|
message: "An unexpected error occurred.",
|
|
});
|
|
|
|
const goBack = () => window.history.back();
|
|
</script>
|
|
|
|
<template>
|
|
<div class="min-h-screen bg-base-300 flex items-center justify-center px-4">
|
|
<div class="w-full max-w-xl text-center">
|
|
<i class="mdi mdi-alert-circle-outline text-7xl text-primary"></i>
|
|
<h1 class="text-7xl font-bold mt-4">{{ code }}</h1>
|
|
<h2 class="text-2xl font-semibold mt-2">{{ title }}</h2>
|
|
<p class="text-base-content/70 mt-4">{{ message }}</p>
|
|
<div class="mt-8 flex items-center justify-center gap-4">
|
|
<a href="/" class="btn btn-primary">
|
|
<i class="mdi mdi-home mr-2"></i>
|
|
Go home
|
|
</a>
|
|
<button @click="goBack" class="btn btn-ghost">
|
|
<i class="mdi mdi-arrow-left mr-2"></i>
|
|
Go back
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|