diff --git a/apps/web/src/pages/generate/constants.ts b/apps/web/src/pages/generate/constants.ts index fce09da53..6dbce4752 100644 --- a/apps/web/src/pages/generate/constants.ts +++ b/apps/web/src/pages/generate/constants.ts @@ -162,6 +162,198 @@ export const TITLE_PRESETS = [ textShadow: "1px 1px 2px rgba(0,0,0,0.3)", }, }, + { + key: "outline_yellow", + label: "黄色描边", + style: { size: 28, color: "#ffd54f", bold: true, italic: false, stroke: true, shadow: false }, + previewStyle: { + color: "#ffd54f", + _strokeColor: "#000000", + _strokeWidth: 2, + fontWeight: 700, + fontSize: "32px", + }, + }, + { + key: "outline_pink", + label: "粉色描边", + style: { size: 28, color: "#ff80ab", bold: true, italic: false, stroke: true, shadow: false }, + previewStyle: { + color: "#ff80ab", + _strokeColor: "#000000", + _strokeWidth: 2, + fontWeight: 700, + fontSize: "32px", + }, + }, + { + key: "outline_blue", + label: "蓝色描边", + style: { size: 28, color: "#82b1ff", bold: true, italic: false, stroke: true, shadow: false }, + previewStyle: { + color: "#82b1ff", + _strokeColor: "#000000", + _strokeWidth: 2, + fontWeight: 700, + fontSize: "32px", + }, + }, + { + key: "outline_green", + label: "绿色描边", + style: { size: 28, color: "#69f0ae", bold: true, italic: false, stroke: true, shadow: false }, + previewStyle: { + color: "#69f0ae", + _strokeColor: "#000000", + _strokeWidth: 2, + fontWeight: 700, + fontSize: "32px", + }, + }, + { + key: "outline_gray", + label: "灰色描边", + style: { size: 28, color: "#bdbdbd", bold: true, italic: false, stroke: true, shadow: false }, + previewStyle: { + color: "#bdbdbd", + _strokeColor: "#000000", + _strokeWidth: 2, + fontWeight: 700, + fontSize: "32px", + }, + }, + { + key: "bg_white", + label: "白底黑字", + style: { size: 28, color: "#1a1a1a", bold: true, italic: false, stroke: false, shadow: false }, + previewStyle: { + color: "#1a1a1a", + fontWeight: 700, + fontSize: "32px", + background: "#ffffff", + borderRadius: "4px", + padding: "2px 6px", + }, + }, + { + key: "bg_yellow", + label: "黄底黑字", + style: { size: 28, color: "#1a1a1a", bold: true, italic: false, stroke: false, shadow: false }, + previewStyle: { + color: "#1a1a1a", + fontWeight: 700, + fontSize: "32px", + background: "#ffd54f", + borderRadius: "4px", + padding: "2px 6px", + }, + }, + { + key: "bg_pink", + label: "粉底黑字", + style: { size: 28, color: "#1a1a1a", bold: true, italic: false, stroke: false, shadow: false }, + previewStyle: { + color: "#1a1a1a", + fontWeight: 700, + fontSize: "32px", + background: "#ff80ab", + borderRadius: "4px", + padding: "2px 6px", + }, + }, + { + key: "bg_red", + label: "红底白字", + style: { size: 28, color: "#ffffff", bold: true, italic: false, stroke: false, shadow: false }, + previewStyle: { + color: "#ffffff", + fontWeight: 700, + fontSize: "32px", + background: "#ef5350", + borderRadius: "4px", + padding: "2px 6px", + }, + }, + { + key: "neon_orange", + label: "橙色发光", + style: { size: 32, color: "#ff9100", bold: true, italic: false, stroke: false, shadow: true }, + previewStyle: { + color: "#ff9100", + fontWeight: 700, + fontSize: "32px", + textShadow: "0 0 4px #ff9100, 0 0 8px #ff9100, 0 0 16px rgba(255,145,0,0.5)", + }, + }, + { + key: "neon_purple", + label: "紫色发光", + style: { size: 32, color: "#d500f9", bold: true, italic: false, stroke: false, shadow: true }, + previewStyle: { + color: "#d500f9", + fontWeight: 700, + fontSize: "32px", + textShadow: "0 0 4px #d500f9, 0 0 8px #d500f9, 0 0 16px rgba(213,0,249,0.5)", + }, + }, + { + key: "bordered_white", + label: "白字绿框", + style: { size: 28, color: "#ffffff", bold: true, italic: false, stroke: false, shadow: false }, + previewStyle: { + color: "#ffffff", + fontWeight: 700, + fontSize: "32px", + background: "#1a1a1a", + border: "2px solid #69f0ae", + borderRadius: "4px", + padding: "2px 6px", + }, + }, + { + key: "gradient_warm", + label: "暖色渐变", + style: { size: 32, color: "#ff6d00", bold: true, italic: false, stroke: false, shadow: true }, + previewStyle: { + color: "#ff6d00", + fontWeight: 700, + fontSize: "32px", + textShadow: "0 0 6px rgba(255,109,0,0.6), 1px 1px 2px rgba(0,0,0,0.5)", + }, + }, + { + key: "gradient_cool", + label: "冷色渐变", + style: { size: 32, color: "#00b0ff", bold: true, italic: false, stroke: false, shadow: true }, + previewStyle: { + color: "#00b0ff", + fontWeight: 700, + fontSize: "32px", + textShadow: "0 0 6px rgba(0,176,255,0.6), 1px 1px 2px rgba(0,0,0,0.5)", + }, + }, + { + key: "shadow_deep", + label: "深影白字", + style: { size: 28, color: "#ffffff", bold: true, italic: false, stroke: false, shadow: true }, + previewStyle: { + color: "#ffffff", + fontWeight: 700, + fontSize: "32px", + textShadow: "2px 2px 4px rgba(0,0,0,0.8), 0 0 8px rgba(0,0,0,0.4)", + }, + }, + { + key: "soft_gold", + label: "柔光金", + style: { size: 28, color: "#ffd54f", bold: true, italic: false, stroke: false, shadow: true }, + previewStyle: { + color: "#ffd54f", + fontWeight: 700, + fontSize: "32px", + textShadow: "0 0 6px rgba(255,213,79,0.5), 1px 1px 2px rgba(0,0,0,0.4)", + }, + }, ] /* ── 封面模式 ── */ diff --git a/apps/web/src/pages/generate/generate.css b/apps/web/src/pages/generate/generate.css index a7961be1e..0811775e7 100644 --- a/apps/web/src/pages/generate/generate.css +++ b/apps/web/src/pages/generate/generate.css @@ -1733,16 +1733,16 @@ /* 标题预设卡片网格 */ .xx-title-presets-grid { display: grid; - grid-template-columns: repeat(8, 1fr); - gap: 0.5px; + grid-template-columns: repeat(6, 1fr); + gap: 0; } .xx-title-preset-card { display: flex; align-items: center; justify-content: center; - width: 48px; - height: 48px; + width: 52px; + height: 52px; padding: 0; background: #404040; border: 2px solid transparent;