hexianglong/o.nmgjg.com.cn
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(index): 优化 404 页面和视频模板

Browse Source 
- 重新设计了 404 页面布局和样式，增加了返回按钮
- 在视频模板中添加了返回按钮
- 优化了按钮样式，增加了hover效果
- 调整了页面结构，提高了可读性和用户体验
This commit is contained in:
root
2025-02-06 23:58:08 +08:00
Unverified
parent da2ef69cb9
commit e79ce1ee89
2 changed files with 88 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
index/404.html
View File

@@ -1,6 +1,61 @@
<html>
<head><title>404 Not Found</title></head>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>404 Not Found</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #ffecec;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
overflow: hidden;
}
.error-container {
text-align: center;
background-color: #ffffff77;
padding: 40px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
h1 {
color: #333;
margin-bottom: 20px;
}
p {
color: #666;
margin-bottom: 20px;
}
.back-button {
padding: 10px 20px;
background-color: #ff3434;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
}
.back-button:hover {
background-color: #990000;
}
</style>
</head>
<body>
<center><h1>404 Not Found</h1></center>
<hr><center>nginx</center>
</body>
<div class="error-container">
<h1>404 Not Found</h1>
<p>您访问的页面不存在。</p>
<button class="back-button" onclick="window.history.back()">返回</button>
</div>
</body>
</html>

29
index/videos/template-video.html
View File

@@ -45,13 +45,34 @@
button:hover {
background-color: #0056b3;
}
.back-button {
padding: 10px 20px;
background-color: #6c757d;
color: white;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
}
.back-button:hover {
background-color: #545b62;
}
</style>
<!-- Import style -->
<!-- <link rel="stylesheet" href="//unpkg.com/element-plus/dist/index.css" />
<script src="//unpkg.com/vue@3"></script>
<script src="//unpkg.com/element-plus"></script> -->
</head>
<body>
<div class="header">
<h1 id="videoTitle">视频播放</h1>
<button onclick="downloadVideo()">下载</button>
<div>
<button onclick="downloadVideo()">下载</button>
<button class="back-button" onclick="window.history.back()">返回</button>
</div>
</div>
<div class="artplayer-app"></div>
<script src="https://cdn.jsdelivr.net/npm/artplayer/dist/artplayer.js"></script>
@@ -98,6 +119,12 @@
});
function downloadVideo() {
// ElNotification({
// title: '提示',
// message: '开始下载，请稍后',
// type: 'success',
// });
fetch(videoUrl)
.then(response => response.blob())
.then(blob => {