前端文件修正

This commit is contained in:
chenhaodong
2026-06-18 22:08:46 +08:00
parent 04cc390fde
commit 1c0b377474
87 changed files with 66 additions and 1605 deletions
+26 -83
View File
@@ -4,47 +4,43 @@
@date 20260620
-->
<template>
<div class="wscn-http404-container">
<div class="wscn-http404">
<div class="error-404-container">
<div class="error-404">
<div class="pic-404">
<img class="pic-404__parent" src="@/assets/404_images/404.png" alt="404">
<img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404">
<img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404">
<img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404">
</div>
<div class="bullshit">
<div class="bullshit__oops">OOPS!</div>
<div class="bullshit__info">All rights reserved
<a style="color:#20a0ff" href="https://wallstreetcn.com" target="_blank">wallstreetcn</a>
</div>
<div class="bullshit__headline">{{ message }}</div>
<div class="bullshit__info">Please check that the URL you entered is correct, or click the button below to return to the homepage.</div>
<a href="" class="bullshit__return-home">Back to home</a>
<div class="error-info">
<div class="error-info__oops">OOPS!</div>
<div class="error-info__headline">{{ message }}</div>
<div class="error-info__info">请检查您输入的网址是否正确或点击下方按钮返回首页</div>
<router-link to="/dashboard" class="error-info__return-home">返回首页</router-link>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'Page404',
computed: {
message() {
return 'The webmaster said that you can not enter this page...'
return '抱歉,您访问的页面不存在'
}
}
}
</script>
<style lang="scss" scoped>
.wscn-http404-container{
.error-404-container{
transform: translate(-50%,-50%);
position: absolute;
top: 40%;
left: 50%;
}
.wscn-http404 {
.error-404 {
position: relative;
width: 1200px;
padding: 0 50px;
@@ -93,74 +89,26 @@ export default {
animation-delay: 1s;
}
@keyframes cloudLeft {
0% {
top: 17px;
left: 220px;
opacity: 0;
}
20% {
top: 33px;
left: 188px;
opacity: 1;
}
80% {
top: 81px;
left: 92px;
opacity: 1;
}
100% {
top: 97px;
left: 60px;
opacity: 0;
}
0% { top: 17px; left: 220px; opacity: 0; }
20% { top: 33px; left: 188px; opacity: 1; }
80% { top: 81px; left: 92px; opacity: 1; }
100% { top: 97px; left: 60px; opacity: 0; }
}
@keyframes cloudMid {
0% {
top: 10px;
left: 420px;
opacity: 0;
}
20% {
top: 40px;
left: 360px;
opacity: 1;
}
70% {
top: 130px;
left: 180px;
opacity: 1;
}
100% {
top: 160px;
left: 120px;
opacity: 0;
}
0% { top: 10px; left: 420px; opacity: 0; }
20% { top: 40px; left: 360px; opacity: 1; }
70% { top: 130px; left: 180px; opacity: 1; }
100% { top: 160px; left: 120px; opacity: 0; }
}
@keyframes cloudRight {
0% {
top: 100px;
left: 500px;
opacity: 0;
}
20% {
top: 120px;
left: 460px;
opacity: 1;
}
80% {
top: 180px;
left: 340px;
opacity: 1;
}
100% {
top: 200px;
left: 300px;
opacity: 0;
}
0% { top: 100px; left: 500px; opacity: 0; }
20% { top: 120px; left: 460px; opacity: 1; }
80% { top: 180px; left: 340px; opacity: 1; }
100% { top: 200px; left: 300px; opacity: 0; }
}
}
}
.bullshit {
.error-info {
position: relative;
float: left;
width: 300px;
@@ -217,16 +165,11 @@ export default {
animation-duration: 0.5s;
animation-delay: 0.3s;
animation-fill-mode: forwards;
text-decoration: none;
}
@keyframes slideUp {
0% {
transform: translateY(60px);
opacity: 0;
}
100% {
transform: translateY(0);
opacity: 1;
}
0% { transform: translateY(60px); opacity: 0; }
100% { transform: translateY(0); opacity: 1; }
}
}
}