feat(nginx): 添加 37point2.cn 网站的 404 错误页面

- 新增 404.html 文件，用于自定义 404 错误页面 - 设计了响应式布局，支持暗黑模式 - 页面包含错误代码、提示信息和返回首页按钮
2025-06-05 16:11:41 +08:00
parent 63d62f37a6
commit dd799ff5ed
1 changed files with 108 additions and 0 deletions
--- a/nginx/37point2.cn/404.html
+++ b/nginx/37point2.cn/404.html
@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="zh-CN">
+<head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>404 - 页面未找到</title>
+    <style>
+        :root {
+            --bg-color: #f5f7fa;
+            --card-bg: #ffffff;
+            --text-color: #333333;
+            --secondary-text: #666666;
+            --primary-color: #0077ff;
+            --button-hover: #005fcc;
+        }
+
+        @media (prefers-color-scheme: dark) {
+            :root {
+                --bg-color: #121212;
+                --card-bg: #1e1e1e;
+                --text-color: #ffffff;
+                --secondary-text: #bbbbbb;
+                --primary-color: #4dabf7;
+                --button-hover: #339af0;
+            }
+        }
+
+        * {
+            box-sizing: border-box;
+            margin: 0;
+            padding: 0;
+        }
+
+        body {
+            font-family: 'Inter', sans-serif;
+            background-color: var(--bg-color);
+            color: var(--text-color);
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            height: 100vh;
+        }
+
+        .container {
+            text-align: center;
+            padding: 40px;
+            background: var(--card-bg);
+            border-radius: 12px;
+            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
+            max-width: 500px;
+            width: 90%;
+            transition: background 0.3s ease, color 0.3s ease;
+        }
+
+        .container h1 {
+            font-size: 96px;
+            font-weight: 600;
+            color: var(--primary-color);
+            margin-bottom: 10px;
+        }
+
+        .container h2 {
+            font-size: 28px;
+            margin-bottom: 20px;
+        }
+
+        .container p {
+            font-size: 16px;
+            margin-bottom: 30px;
+            color: var(--secondary-text);
+        }
+
+        .btn {
+            display: inline-block;
+            padding: 12px 24px;
+            background-color: var(--primary-color);
+            color: white;
+            border: none;
+            border-radius: 6px;
+            font-size: 16px;
+            text-decoration: none;
+            transition: background-color 0.3s ease;
+        }
+
+        .btn:hover {
+            background-color: var(--button-hover);
+        }
+
+        @media (max-width: 600px) {
+            .container h1 {
+                font-size: 72px;
+            }
+
+            .container h2 {
+                font-size: 22px;
+            }
+        }
+    </style>
+</head>
+<body>
+<div class="container">
+    <h1>404</h1>
+    <h2>页面未找到</h2>
+    <p>很抱歉，您访问的页面不存在或已被移动。</p>
+    <a href="/" class="btn">返回首页</a>
+</div>
+</body>
+</html>