diff --git a/apps/web/src/pages/editing-planner/EditingPlanner.css b/apps/web/src/pages/editing-planner/EditingPlanner.css index 0e26382c6..3986dc611 100644 --- a/apps/web/src/pages/editing-planner/EditingPlanner.css +++ b/apps/web/src/pages/editing-planner/EditingPlanner.css @@ -1194,6 +1194,38 @@ color: var(--primary, #6366f1); } +/* 标题预设样式按钮 */ +.ep-title-presets { + display: flex; + gap: 8px; +} + +.ep-title-preset-btn { + flex: 1; + height: 36px; + background: var(--bg-primary, #ffffff); + border: 1px solid var(--border-color, #e2e8f0); + border-radius: var(--radius-xs, 8px); + color: var(--text-secondary, #64748b); + font-size: 12px; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + gap: 4px; + transition: all 0.2s 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; +} + /* AI推荐按钮 */ .ep-ai-recommend-btn { width: 100%; diff --git a/apps/web/src/pages/editing-planner/components/ClipPropertiesPanel.tsx b/apps/web/src/pages/editing-planner/components/ClipPropertiesPanel.tsx index 2533c8781..5ca449295 100644 --- a/apps/web/src/pages/editing-planner/components/ClipPropertiesPanel.tsx +++ b/apps/web/src/pages/editing-planner/components/ClipPropertiesPanel.tsx @@ -81,6 +81,28 @@ const BGM_OPTIONS = [ { value: "bgm_04", label: "🎵 科技感" }, ]; +/** 标题样式预设 — 一键应用一组样式 */ +const TITLE_PRESETS = [ + { + key: "classic", + label: "经典", + icon: "🅰", + style: { font: "思源黑体", size: 24, bold: true, italic: false, stroke: true, shadow: false }, + }, + { + key: "bold", + label: "醒目", + icon: "🔠", + style: { font: "思源黑体", size: 32, bold: true, italic: false, stroke: true, shadow: true }, + }, + { + key: "elegant", + label: "柔和", + icon: "🅒", + style: { font: "思源宋体", size: 20, bold: false, italic: false, stroke: false, shadow: true }, + }, +]; + const ClipPropertiesPanel: React.FC = ({ selectedClip, titleSettings, @@ -172,6 +194,23 @@ const ClipPropertiesPanel: React.FC = ({ +
+ +
+ {TITLE_PRESETS.map((p) => ( + + ))} +
+
+