STEMMechanics/Website
1
0
Fork 0
Code Issues 4 Pull Requests 1 Actions Packages Projects Releases 3 Wiki Activity

updated error pages

Browse Source
This commit is contained in:
James Collins
2023-03-01 09:38:37 +10:00
parent 30e51dddd7
commit 52d40cb8a1
8 changed files with 78 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
resources/js/components/errors/Forbidden.vue
View File

@@ -1,19 +1,28 @@
<template>
<SMPage no-breadcrumbs>
<div class="sm-page-error sm-error-forbidden">
<div class="image"></div>
<div class="content">
<h1>The cat says no!</h1>
<p>You do not have the needed access to see this page</p>
<div class="sm-page-error sm-error-not-found">
<div class="sm-error-number">
4<img src="/img/sad-monster.png" />3
</div>
<div class="sm-error-content">
<h2>Ooops!</h2>
<p>This page is not for you to view!</p>
<SMButton label="Go Back" @click="handleClick" />
</div>
</div>
</SMPage>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import SMButton from "../SMButton.vue";
import { useRouter } from "vue-router";
<style lang="scss">
.sm-page-error.sm-error-forbidden .image {
background-image: url("/img/403.jpg");
}
</style>
const router = useRouter();
/**
* Handle user clicking back/home button
*/
const handleClick = () => {
router.go(-1);
};
</script>

31
resources/js/components/errors/Internal.vue
View File

@@ -1,22 +1,31 @@
<template>
<SMPage no-breadcrumbs>
<div class="sm-page-error sm-error-internal">
<div class="image"></div>
<div class="content">
<h1>The cat has broken something</h1>
<div class="sm-page-error sm-error-not-found">
<div class="sm-error-number">
5<img src="/img/sad-monster.png" />0
</div>
<div class="sm-error-content">
<h2>Ooops!</h2>
<p>
We are working to fix that what was broken. Please try again
later.
later!
</p>
<SMButton label="Go Back" @click="handleClick" />
</div>
</div>
</SMPage>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import SMButton from "../SMButton.vue";
import { useRouter } from "vue-router";
<style lang="scss">
.sm-page-error.sm-error-internal .image {
background-image: url("/img/500.jpg");
}
</style>
const router = useRouter();
/**
* Handle user clicking back/home button
*/
const handleClick = () => {
router.go(-1);
};
</script>

29
resources/js/components/errors/NotFound.vue
View File

@@ -1,19 +1,28 @@
<template>
<SMPage no-breadcrumbs>
<div class="sm-page-error sm-error-not-found">
<div class="image"></div>
<div class="content">
<h1>Opps</h1>
<p>The page you asked for was not found</p>
<div class="sm-error-number">
4<img src="/img/sad-monster.png" />4
</div>
<div class="sm-error-content">
<h2>Ooops!</h2>
<p>The page you are looking for does not exist!</p>
<SMButton label="Go Back" @click="handleClick" />
</div>
</div>
</SMPage>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import SMButton from "../SMButton.vue";
import { useRouter } from "vue-router";
<style lang="scss">
.sm-page-error.sm-error-not-found .image {
background-image: url("/img/404.jpg");
}
</style>
const router = useRouter();
/**
* Handle user clicking back/home button
*/
const handleClick = () => {
router.go(-1);
};
</script>