ISMAIL MASSERAN
45 lines
1.6 KiB
Vue
45 lines
1.6 KiB
Vue
<script lang="ts" setup>
|
|
import errorIllustrationUrl from '@/assets/images/error-illustration.svg'
|
|
import { RouterLink } from 'vue-router'
|
|
import { Button } from '@/components/ui/button'
|
|
import { resolvePostAuthRoute } from '@/modules/auth'
|
|
import { useAuthStore } from '@/stores/auth'
|
|
|
|
const authStore = useAuthStore()
|
|
const homeRoute = resolvePostAuthRoute(authStore.user)
|
|
</script>
|
|
|
|
<template>
|
|
<div :class="[
|
|
'relative py-2',
|
|
'before:bg-primary dark:before:bg-foreground/[.01] before:fixed before:inset-0 before:bg-noise',
|
|
'after:bg-accent after:bg-contain after:fixed after:inset-0 after:blur-xl dark:after:opacity-20',
|
|
]">
|
|
<div class="container relative z-10 mx-auto">
|
|
<div class="flex h-screen flex-col items-center justify-center text-center lg:flex-row lg:text-left">
|
|
<div class="lg:mr-20">
|
|
<img
|
|
class="h-48 w-[450px] lg:h-auto"
|
|
:src="errorIllustrationUrl"
|
|
alt="Access denied"
|
|
/>
|
|
</div>
|
|
<div class="mt-10 text-white lg:mt-0">
|
|
<div class="text-9xl [text-shadow:_7px_7px_--alpha(var(--color-white)_/_20%)]">403</div>
|
|
<div class="mt-8 text-xl font-medium lg:text-2xl">Access denied.</div>
|
|
<div class="mt-3 text-base opacity-70">
|
|
You do not have permission to access this page.
|
|
</div>
|
|
<Button
|
|
as-child
|
|
class="box mt-10 border border-white bg-transparent px-7 py-6 text-white"
|
|
variant="ghost"
|
|
>
|
|
<RouterLink :to="homeRoute">Back to Home</RouterLink>
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|