feat(editing-planner): 标题预设按钮改为方形T字预览样式 + CSS更新
CI/CD Pipeline / Frontend Lint (push) Has been cancelled
CI/CD Pipeline / Deploy Staging (push) Has been cancelled
CI/CD Pipeline / Staging E2E Tests (push) Has been cancelled
CI/CD Pipeline / Build Production Runtime Images (push) Has been cancelled
CI/CD Pipeline / Deploy Production (push) Has been cancelled
CI/CD Pipeline / Production Browser E2E (push) Has been cancelled
CI/CD Pipeline / Validate Code Quality And Tests (push) Has been cancelled

- 预设只绑定样式属性(粗细、描边、阴影、字号),不绑定字体家族
- 按钮用T字母展示实际效果(font-weight/stroke/shadow/fontSize)
- 选中态用高亮外框+背景标识
- 新增默认/经典/醒目/柔和4个预设
- CSS: 方形按钮布局(48px高)、T字预览、小标签、active高亮态

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
灵应
2026-07-06 16:15:17 +08:00
parent 5986da8fe8
commit 7c77c50bc5
@@ -1194,7 +1194,7 @@
color: var(--primary, #6366f1);
}
/* 标题预设样式按钮 */
/* 标题预设样式按钮 — 方形 T 字预览 */
.ep-title-presets {
display: flex;
gap: 8px;
@@ -1202,28 +1202,47 @@
.ep-title-preset-btn {
flex: 1;
height: 36px;
min-width: 44px;
height: 48px;
background: var(--bg-primary, #ffffff);
border: 1px solid var(--border-color, #e2e8f0);
border: 2px solid var(--border-color, #e2e8f0);
border-radius: var(--radius-xs, 8px);
color: var(--text-secondary, #64748b);
font-size: 12px;
color: var(--text-primary, #1e293b);
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
transition: all 0.2s ease;
gap: 2px;
padding: 4px 6px;
transition: all 0.15s ease;
}
.ep-title-preset-btn:hover {
border-color: var(--primary, #6366f1);
color: var(--primary, #6366f1);
background: var(--primary-soft, #eef2ff);
}
.ep-title-preset-icon {
font-size: 14px;
.ep-title-preset-btn.active {
border-color: var(--primary, #6366f1);
background: var(--primary-soft, #eef2ff);
box-shadow: 0 0 0 1px var(--primary, #6366f1);
}
.ep-title-preset-t {
line-height: 1;
font-family: inherit;
}
.ep-title-preset-label {
font-size: 10px;
color: var(--text-tertiary, #94a3b8);
line-height: 1;
}
.ep-title-preset-btn.active .ep-title-preset-label {
color: var(--primary, #6366f1);
font-weight: 500;
}
/* AI推荐按钮 */