refactor(about): 移除内联关键CSS并优化页面结构
- 删除了 about.html 中的内联关键 CSS 样式代码 - 保留了主题变量和基础样式的定义逻辑 - 简化了主容器的媒体查询配置 - 调整了页面底部链接与脚本加载顺序 - 优化了整体HTML结构以提升可维护性
This commit is contained in:
59
about.html
59
about.html
@@ -48,62 +48,7 @@
|
||||
<link rel="preload" href="css/artalk.css?version=20251125" as="style" onload="this.onload=null;this.rel='stylesheet'">
|
||||
<link rel="icon" href="favicon.ico">
|
||||
<link rel="apple-touch-icon" href="./images/logo.png">
|
||||
|
||||
<!-- 关键CSS内联 -->
|
||||
<style>
|
||||
/* 关键的首屏样式 */
|
||||
:root {
|
||||
--font-main: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "PingFang SC", "Microsoft YaHei", sans-serif;
|
||||
--bg-base: #f3f4f6;
|
||||
--text-primary: #1f2937;
|
||||
--glass-bg: rgba(255, 255, 255, 0.75);
|
||||
--glass-border: 1px solid rgba(255, 255, 255, 0.9);
|
||||
--glass-shadow: 0 12px 36px rgba(0, 0, 0, 0.12);
|
||||
--radius: 24px;
|
||||
}
|
||||
|
||||
[data-theme="night"] {
|
||||
--bg-base: #0f0f12;
|
||||
--text-primary: #ffffff;
|
||||
--glass-bg: rgba(30, 30, 35, 0.55);
|
||||
--glass-border: 1px solid rgba(255, 255, 255, 0.15);
|
||||
--glass-shadow: 0 18px 60px rgba(0, 0, 0, 0.65);
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: var(--font-main);
|
||||
background: var(--bg-base);
|
||||
color: var(--text-primary);
|
||||
line-height: 1.6;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
.app-root {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.main-container {
|
||||
flex: 1;
|
||||
margin: 120px auto 60px;
|
||||
padding: 0 30px;
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.main-container {
|
||||
margin: 20px auto 100px;
|
||||
padding: 0 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
<!--IE淘汰计划-->
|
||||
<script>
|
||||
@@ -473,4 +418,4 @@
|
||||
<link rel="stylesheet" href="css/artalk.css?version=20251125">
|
||||
</noscript>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user