模板样式令牌化:字号落到 5 档阶梯、圆角改走 --tb-radius

11 个模板里的硬编码字号/圆角换成令牌,为之后的深色与主题一致性打底。

字号(base.css 的 --tb-fs-xs/md/lg/xl/hero = 12/14/16/24/28):
- 0.70~0.88rem、0.72rem 等五六档零碎值 → --tb-fs-xs(标签/meta) / --tb-fs-md(正文、列表、按钮)
- 0.95~1rem → --tb-fs-lg;1.5rem 大数字 → --tb-fs-xl;1.75rem 首页主标题 → --tb-fs-hero
- 以下几处**故意改变了观感**(不是等价替换,先记下来免得以后当 regression 查):
  explore 的 .explore-name 1.2rem → 1rem;.hot-vote-title 0.98 → 0.875;
  首页 .tb-stat-num 手机端 1.25 → 1rem;.hot-vote-action 0.82 → 0.875(变大)。

圆角:
- 8/9/10px → --tb-radius-sm(8) / --tb-radius(12,对话框与气泡);3/4/5/6px → --tb-radius-xs(6)
- 头像 50%、胶囊 999px 保留原样(语义值,不是视觉随意值)

其它:header 验证码输入框边框 #ccc → var(--tb-border);chat 气泡与图片的圆角走内联 var()。

仍未令牌化(留给下一轮):templates/user/profile.html 还有 16 处 font-size、base.css 自身 11 处
(0.78/0.82/0.88/0.95/1.1),邮件模板 mail/* 保持 px 不动(邮件客户端不保证 var())。
This commit is contained in:
tamakyi
2026-10-21 18:28:26 +08:00
parent dc90d96bde
commit 001306d940
11 changed files with 67 additions and 67 deletions
+13 -13
View File
@@ -9,7 +9,7 @@
}
.tb-hero-title {
margin: 0;
font-size: 1.75rem;
font-size: var(--tb-fs-hero);
line-height: 1.35;
font-weight: 600;
color: var(--tb-text);
@@ -17,7 +17,7 @@
.tb-hero-lead {
margin: 12px auto 0;
max-width: 30rem;
font-size: 0.95rem;
font-size: var(--tb-fs-lg);
line-height: 1.8;
color: var(--tb-text-muted);
}
@@ -43,13 +43,13 @@
}
.tb-card-title {
margin: 0 0 6px;
font-size: 0.98rem;
font-size: var(--tb-fs-lg);
font-weight: 600;
color: var(--tb-text);
}
.tb-card-text {
margin: 0;
font-size: 0.86rem;
font-size: var(--tb-fs-md);
line-height: 1.7;
color: var(--tb-text-muted);
}
@@ -64,7 +64,7 @@
}
.tb-section-title {
margin: 0 0 10px;
font-size: 0.95rem;
font-size: var(--tb-fs-lg);
font-weight: 600;
color: var(--tb-text);
}
@@ -75,18 +75,18 @@
border-radius: var(--tb-radius-xs);
background: var(--tb-primary-weak);
color: var(--tb-primary);
font-size: 0.75rem;
font-size: var(--tb-fs-xs);
}
.tb-list {
margin: 0;
padding-left: 1.15em;
font-size: 0.9rem;
font-size: var(--tb-fs-md);
line-height: 1.9;
color: var(--tb-text);
}
.tb-changelog summary {
cursor: pointer;
font-size: 0.9rem;
font-size: var(--tb-fs-md);
font-weight: 600;
color: var(--tb-text);
list-style: none;
@@ -108,7 +108,7 @@
}
.tb-stat-num {
display: block;
font-size: 1.5rem;
font-size: var(--tb-fs-xl);
font-weight: 600;
line-height: 1.3;
color: var(--tb-text);
@@ -116,20 +116,20 @@
.tb-stat-label {
display: block;
margin-top: 2px;
font-size: 0.78rem;
font-size: var(--tb-fs-xs);
color: var(--tb-text-muted);
}
.tb-stats-meta {
margin: 14px 0 0;
font-size: 0.78rem;
font-size: var(--tb-fs-xs);
line-height: 1.8;
color: var(--tb-text-muted);
text-align: center;
}
@media (max-width: 480px) {
.tb-hero { padding: 28px 16px 24px; }
.tb-hero-title { font-size: 1.4rem; }
.tb-stat-num { font-size: 1.25rem; }
.tb-hero-title { font-size: var(--tb-fs-xl); }
.tb-stat-num { font-size: var(--tb-fs-lg); }
}
</style>