diff --git a/core/frontend/src/pipeline-page.css b/core/frontend/src/pipeline-page.css index 38f2114..7f6e83f 100644 --- a/core/frontend/src/pipeline-page.css +++ b/core/frontend/src/pipeline-page.css @@ -151,17 +151,17 @@ /* 行: 生成时左侧脚本区罩子(整体)/ 单镜罩子 + 转圈 */ .script-gen-veil { position: absolute; inset: 0; z-index: 6; display: flex; align-items: center; justify-content: center; background: color-mix(in srgb, var(--background-base) 86%, transparent); } /* 方案 B · 品牌生成卡:icon-box 转圈 + 标题 + 动态点 + 橙色扫光进度条 */ - .script-gen-veil .sgv-card { display: flex; align-items: center; gap: 12px; padding: 14px 18px; min-width: 252px; background: var(--surface); border: 1px solid var(--border-faint); border-radius: var(--r-md); box-shadow: var(--shadow-floating); } - .script-gen-veil .sgv-ico { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; background: var(--heat-12); border-radius: var(--r-sm); } - .script-gen-veil .sgv-ico .spinner { width: 18px; height: 18px; border: 2.5px solid var(--heat-20); border-top-color: var(--heat); border-radius: 50%; animation: assetSpin .7s linear infinite; } - .script-gen-veil .sgv-body { flex: 1; display: flex; flex-direction: column; gap: 9px; } - .script-gen-veil .sgv-title { font-size: 13px; font-weight: 500; color: var(--ink); display: inline-flex; align-items: center; gap: 4px; } - .script-gen-veil .sgv-dots { display: inline-flex; gap: 3px; align-items: center; } - .script-gen-veil .sgv-dots i { width: 3px; height: 3px; border-radius: 50%; background: var(--heat); animation: sgvBlink 1.2s infinite; } - .script-gen-veil .sgv-dots i:nth-child(2) { animation-delay: .2s; } - .script-gen-veil .sgv-dots i:nth-child(3) { animation-delay: .4s; } - .script-gen-veil .sgv-bar { position: relative; height: 4px; border-radius: 999px; background: var(--heat-12); overflow: hidden; } - .script-gen-veil .sgv-bar::after { content: ""; position: absolute; top: 0; bottom: 0; width: 42%; border-radius: 999px; background: var(--heat); animation: sgvBar 1.15s ease-in-out infinite; } + .sgv-card { display: flex; align-items: center; gap: 12px; padding: 14px 18px; min-width: 252px; background: var(--surface); border: 1px solid var(--border-faint); border-radius: var(--r-md); box-shadow: var(--shadow-floating); } + .sgv-ico { width: 32px; height: 32px; flex: 0 0 32px; display: grid; place-items: center; background: var(--heat-12); border-radius: var(--r-sm); } + .sgv-ico .spinner { width: 18px; height: 18px; border: 2.5px solid var(--heat-20); border-top-color: var(--heat); border-radius: 50%; animation: assetSpin .7s linear infinite; } + .sgv-body { flex: 1; display: flex; flex-direction: column; gap: 9px; } + .sgv-title { font-size: 13px; font-weight: 500; color: var(--ink); display: inline-flex; align-items: center; gap: 4px; } + .sgv-dots { display: inline-flex; gap: 3px; align-items: center; } + .sgv-dots i { width: 3px; height: 3px; border-radius: 50%; background: var(--heat); animation: sgvBlink 1.2s infinite; } + .sgv-dots i:nth-child(2) { animation-delay: .2s; } + .sgv-dots i:nth-child(3) { animation-delay: .4s; } + .sgv-bar { position: relative; height: 4px; border-radius: 999px; background: var(--heat-12); overflow: hidden; } + .sgv-bar::after { content: ""; position: absolute; top: 0; bottom: 0; width: 42%; border-radius: 999px; background: var(--heat); animation: sgvBar 1.15s ease-in-out infinite; } .shot-gen-veil { position: absolute; inset: 0; z-index: 4; display: flex; gap: 8px; align-items: center; justify-content: center; background: color-mix(in srgb, var(--background-base) 80%, transparent); border-radius: var(--r-sm); } .shot-gen-veil .mono { font-size: 12px; color: var(--ink-3); letter-spacing: .04em; } .script-gen-veil .spinner, .shot-gen-veil .spinner { width: 26px; height: 26px; border: 2.5px solid var(--heat-20); border-top-color: var(--heat); border-radius: 50%; animation: assetSpin .7s linear infinite; flex: 0 0 auto; } @@ -855,3 +855,8 @@ .rg-actions .btn-primary { flex: 1; } .rg-force { display: inline-flex; align-items: baseline; gap: 5px; } .rg-warn { font-size: 10px; font-family: var(--font-mono); color: var(--black-alpha-48); } + +/* 基础资产页:右上角(头像正下方)重新提取按钮 */ +.pipeline-reextract { position: absolute; top: 14px; right: 28px; z-index: 5; } +/* 提取闸门单按钮:醒目主 CTA */ +.eg-extract-btn { margin-top: 24px; min-width: 220px; } diff --git a/core/frontend/src/routes/pipeline.tsx b/core/frontend/src/routes/pipeline.tsx index 2ea3090..bdf2f32 100644 --- a/core/frontend/src/routes/pipeline.tsx +++ b/core/frontend/src/routes/pipeline.tsx @@ -2222,6 +2222,12 @@ export function PipelinePage(props: {