优化前端
This commit is contained in:
@@ -32,26 +32,20 @@
|
||||
}
|
||||
|
||||
.asset-factory .af-page-head {
|
||||
min-height: 76px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 30px;
|
||||
margin-bottom: 34px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.asset-factory .af-page-head h1 {
|
||||
margin: 0 0 10px;
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
letter-spacing: -.02em;
|
||||
color: var(--accent-black);
|
||||
}
|
||||
.asset-factory .af-page-head p {
|
||||
margin: 0;
|
||||
color: var(--af-muted);
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.asset-factory .af-tools {
|
||||
display: grid;
|
||||
|
||||
@@ -40,9 +40,8 @@
|
||||
}
|
||||
|
||||
.fc-page .fc-head {
|
||||
min-height: 76px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 30px;
|
||||
margin-bottom: 18px;
|
||||
@@ -73,14 +72,13 @@
|
||||
}
|
||||
.fc-page .fc-back svg { width: 19px; height: 19px; }
|
||||
.fc-page .fc-head h1 {
|
||||
margin: 0 0 10px;
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
letter-spacing: -.02em;
|
||||
color: var(--accent-black);
|
||||
}
|
||||
.fc-page .fc-head p { margin: 0; color: var(--fc-muted); font-size: 15px; }
|
||||
.fc-page .fc-material {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
@@ -25,22 +25,20 @@
|
||||
}
|
||||
|
||||
.projects-page .vc-head {
|
||||
min-height: 76px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 30px;
|
||||
margin-bottom: 26px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.projects-page .vc-head h1 {
|
||||
margin: 0 0 10px;
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
letter-spacing: -.02em;
|
||||
color: var(--accent-black);
|
||||
}
|
||||
.projects-page .vc-head p { margin: 0; color: var(--vc-muted); font-size: 15px; }
|
||||
.projects-page .vc-actions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
|
||||
.projects-page .vc-ghost {
|
||||
min-width: 132px;
|
||||
|
||||
@@ -268,10 +268,7 @@ export function AssetFactoryPage({ navigate }: { navigate: (page: Page) => void
|
||||
<div className="asset-factory">
|
||||
<div className="asset-factory-inner">
|
||||
<header className="af-page-head">
|
||||
<div>
|
||||
<h1>图片创作</h1>
|
||||
<p>从商品与模特资产出发,快速完成电商图片生产</p>
|
||||
</div>
|
||||
<h1>图片创作</h1>
|
||||
</header>
|
||||
|
||||
<div className="af-tools">
|
||||
@@ -294,7 +291,6 @@ export function AssetFactoryPage({ navigate }: { navigate: (page: Page) => void
|
||||
<div className="af-section">
|
||||
<div>
|
||||
<h2>最近创作</h2>
|
||||
<p>查看图片任务状态与生成结果</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -607,10 +607,7 @@ export function FreeCreatePage({ modelConfigs, onNotify, onTaskSettled, onBack }
|
||||
<ArrowLeft />
|
||||
</button>
|
||||
) : null}
|
||||
<div>
|
||||
<h1>自由生成</h1>
|
||||
<p>使用提示词和参考素材,自由控制视频画面与参数</p>
|
||||
</div>
|
||||
<h1>自由生成</h1>
|
||||
</div>
|
||||
<div className="fc-material">
|
||||
<button type="button" className="fc-ghost" onClick={() => openLibrary()}>
|
||||
|
||||
@@ -592,16 +592,12 @@ export function ProjectsPage({ products, projects, loading = false, navigate, op
|
||||
<section className={`projects-page${editMode ? " manage-mode" : ""}`}>
|
||||
<div className="projects-inner">
|
||||
<header className="vc-head">
|
||||
<div>
|
||||
<h1>视频创作</h1>
|
||||
<p>从商品或参考视频出发,选择适合当前任务的生产方式</p>
|
||||
</div>
|
||||
<h1>视频创作</h1>
|
||||
</header>
|
||||
|
||||
<section className="vc-sec">
|
||||
<div className="vc-sec-h">
|
||||
<h2>商品视频生产</h2>
|
||||
<p>以商品卖点为核心,快速生成完整带货视频</p>
|
||||
</div>
|
||||
<div className="vc-tools two">
|
||||
{VIDEO_MAKE.map((card) => (
|
||||
@@ -622,7 +618,6 @@ export function ProjectsPage({ products, projects, loading = false, navigate, op
|
||||
<section className="vc-sec">
|
||||
<div className="vc-sec-h">
|
||||
<h2>AI 视频工具</h2>
|
||||
<p>自由生成,或复用参考视频中已经验证过的内容表达</p>
|
||||
</div>
|
||||
<div className="vc-tools three">
|
||||
{VIDEO_TOOLS.map((card) => (
|
||||
@@ -643,7 +638,6 @@ export function ProjectsPage({ products, projects, loading = false, navigate, op
|
||||
<div className="vc-sec-h vc-list-h">
|
||||
<div>
|
||||
<h2>视频项目</h2>
|
||||
<p>统一查看各类视频任务的状态与生成结果</p>
|
||||
</div>
|
||||
<button className={`vc-ghost${editMode ? " is-on" : ""}`} type="button" onClick={() => (editMode ? exitEdit() : setEditMode(true))}>
|
||||
<Settings2 />
|
||||
|
||||
@@ -504,7 +504,6 @@ export function VideoRemixPage({ textModels = [], onNotify, onBack, navigate }:
|
||||
</button>
|
||||
<div className="page-heading">
|
||||
<h1>提炼提示词</h1>
|
||||
<p>上传参考视频,生成可编辑的视频提示词</p>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
@@ -27,17 +27,16 @@
|
||||
|
||||
.vr-page .page-header {
|
||||
position: relative;
|
||||
min-height: 76px;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 30px;
|
||||
margin-bottom: 34px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.vr-page .image-title-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
gap: 13px;
|
||||
}
|
||||
|
||||
@@ -47,7 +46,6 @@
|
||||
display: grid;
|
||||
place-items: center;
|
||||
flex: 0 0 auto;
|
||||
margin-top: 2px;
|
||||
border: 1px solid rgba(0, 47, 167, 0.46);
|
||||
border-radius: 12px;
|
||||
color: var(--klein);
|
||||
@@ -64,18 +62,13 @@
|
||||
.vr-page .image-back-button svg { width: 19px; height: 19px; }
|
||||
|
||||
.vr-page .page-heading h1 {
|
||||
margin: 0 0 10px;
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
letter-spacing: -.02em;
|
||||
color: var(--text);
|
||||
}
|
||||
.vr-page .page-heading p {
|
||||
margin: 0;
|
||||
color: var(--muted);
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.vr-page .video-flow-grid {
|
||||
display: grid;
|
||||
|
||||
@@ -26,17 +26,17 @@
|
||||
}
|
||||
|
||||
.vrep-page .page-header {
|
||||
min-height: 76px;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 30px;
|
||||
margin-bottom: 34px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.vrep-page .image-title-row {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
align-items: center;
|
||||
gap: 13px;
|
||||
}
|
||||
|
||||
@@ -46,7 +46,6 @@
|
||||
display: grid;
|
||||
place-items: center;
|
||||
flex: 0 0 auto;
|
||||
margin-top: 2px;
|
||||
border: 1px solid rgba(0, 47, 167, 0.46);
|
||||
border-radius: 12px;
|
||||
color: var(--klein);
|
||||
@@ -55,17 +54,15 @@
|
||||
box-shadow: 0 5px 14px rgba(0, 47, 167, 0.07);
|
||||
transition: background-color 180ms ease, transform 180ms ease;
|
||||
}
|
||||
|
||||
.vrep-page .image-back-button:hover {
|
||||
transform: translateX(-2px);
|
||||
border-color: var(--klein);
|
||||
background: rgba(0, 47, 167, 0.055);
|
||||
}
|
||||
|
||||
.vrep-page .image-back-button svg { width: 19px; height: 19px; }
|
||||
|
||||
.vrep-page .page-heading h1 {
|
||||
margin: 0 0 10px;
|
||||
margin: 0;
|
||||
font-size: 32px;
|
||||
line-height: 1.2;
|
||||
font-weight: 600;
|
||||
|
||||
Reference in New Issue
Block a user