87 lines
2.5 KiB
CSS
87 lines
2.5 KiB
CSS
/**
|
||
* 门户字体 Token（推荐全站统一方案）
|
||
* txw-mhzc-web v1.0 — 2026-05-20
|
||
*/
|
||
:root {
|
||
/* 字体族 */
|
||
--page-font-family: 'PingFang SC', 'Microsoft YaHei', Arial, sans-serif;
|
||
--page-font-family-medium: 'PingFang SC', 'Microsoft YaHei', Arial, sans-serif;
|
||
--page-font-family-display: 'FZZhengHeiS-B-GB', 'PingFang SC', 'Microsoft YaHei', sans-serif;
|
||
--page-font-family-mono: 'Fira Code', 'SFMono-Regular', Consolas, monospace;
|
||
|
||
/* 字号 */
|
||
--page-font-size-xs: 10px;
|
||
--page-font-size-sm: 12px;
|
||
--page-font-size-base: 14px;
|
||
--page-font-size-md: 16px;
|
||
--page-font-size-lg: 18px;
|
||
--page-font-size-xl: 22px;
|
||
--page-font-size-2xl: 24px;
|
||
--page-font-size-3xl: 28px;
|
||
--page-font-size-4xl: 32px;
|
||
|
||
/* 行高增量（与 TDesign 一致：字号 + 8px） */
|
||
--page-line-height-delta: 8px;
|
||
|
||
/* 组合：导航 */
|
||
--page-font-nav: 500 var(--page-font-size-md) /
|
||
calc(var(--page-font-size-md) + var(--page-line-height-delta))
|
||
var(--page-font-family);
|
||
|
||
/* 组合：正文 */
|
||
--page-font-body: 400 var(--page-font-size-base) /
|
||
calc(var(--page-font-size-base) + var(--page-line-height-delta))
|
||
var(--page-font-family);
|
||
|
||
--page-font-body-md: 400 var(--page-font-size-md) /
|
||
calc(var(--page-font-size-md) + var(--page-line-height-delta))
|
||
var(--page-font-family);
|
||
|
||
/* 组合：区块标题 */
|
||
--page-font-section-title: 600 var(--page-font-size-4xl) /
|
||
calc(var(--page-font-size-4xl) + var(--page-line-height-delta))
|
||
var(--page-font-family);
|
||
|
||
--page-font-module-title: 600 var(--page-font-size-2xl) /
|
||
calc(var(--page-font-size-2xl) + var(--page-line-height-delta))
|
||
var(--page-font-family);
|
||
|
||
/* 组合：展示 Banner */
|
||
--page-font-display-title: 600 32px / 40px var(--page-font-family-display);
|
||
--page-font-display-subtitle: 500 var(--page-font-size-lg) /
|
||
calc(var(--page-font-size-lg) + var(--page-line-height-delta))
|
||
var(--page-font-family);
|
||
}
|
||
|
||
/* 全局默认（建议在入口覆盖 tailwindcss body） */
|
||
body {
|
||
font: var(--page-font-body-md);
|
||
font-family: var(--page-font-family);
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
}
|
||
|
||
.page-font-nav {
|
||
font: var(--page-font-nav);
|
||
}
|
||
|
||
.page-font-body {
|
||
font: var(--page-font-body);
|
||
}
|
||
|
||
.page-font-section-title {
|
||
font: var(--page-font-section-title);
|
||
}
|
||
|
||
.page-font-module-title {
|
||
font: var(--page-font-module-title);
|
||
}
|
||
|
||
.page-font-display-title {
|
||
font: var(--page-font-display-title);
|
||
}
|
||
|
||
.page-font-mono {
|
||
font-family: var(--page-font-family-mono);
|
||
}
|