添加404页面

This commit is contained in:
X1627315083
2024-02-19 10:33:54 +08:00
parent 71bba5b60a
commit 0d85fd74e0
3 changed files with 125 additions and 13 deletions

90
src/views/404.vue Normal file
View File

@@ -0,0 +1,90 @@
<template>
<div class="aida-404page">
<div class="aida-404page-content">
<h1 class="aida-404">404</h1>
<p class="aida-text">NOT FOUND</p>
</div>
</div>
</template>
<script>
import { defineComponent,h,ref} from "vue";
export default defineComponent({
data(){
return{
}
},
mounted(){
},
methods:{
}
})
</script>
<style scoped lang="less">
.aida-404page{
height: 100vh;
width: 100vw;
position: relative;
--upgradePageColor:#000;
.aida-404page-content{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
.aida-404{
font-size: 30vh;
font-weight: bold;
position: relative;
line-height: 1;
text-align: center;
padding: 0;
margin: 0;
}
.aida-404::after{
content: '404';
position: absolute;
top: 0;
left: 0;
right: 0;
color: transparent;
background: -webkit-repeating-linear-gradient(-45deg, #71b7e6, #69a6ce, #b98acc, #ee8176, #b98acc, #69a6ce, #9b59b6);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-size: 400%;
text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.25);
animation: animateTextBackground 10s ease-in-out infinite;
@keyframes animateTextBackground {
0%{
background-position: 0 0;
}
25%{
background-position: 100% 0;
}
50%{
background-position: 100% 100%;
}
75%{
background-position: 0 100%;
}
100%{
background-position: 0 0;
}
}
}
.aida-text{
color: #d6d6d6;
font-size: 8vh;
text-align: center;
font-weight: bold;
line-height: 10vh;
max-width: 600px;
position: relative;
}
}
}
</style>

View File

@@ -219,7 +219,7 @@
</div>
<div class="login_footer">
<div class="login_footer_item"><div class="login_footer_item_text">©2024 CodeCreate</div></div>
<div class="login_footer_item"><div class="login_footer_item_text">©2024 Code-Create Limited</div></div>
<div class="login_footer_item">
<div class="login_footer_item_text footer_item_text_pointer" @click="turnToWindow('https://code-create.com.hk/aida-terms-and-conditions/')">Terms&Conditions</div>
<div class="login_footer_line"></div>