krisolo/storyforge
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: simplify storyforge ops ui copy

Browse Source
This commit is contained in:
kris
2026-03-22 08:08:04 +08:00
parent e771919e4a
commit 98592168b7
2 changed files with 72 additions and 70 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
output/ui/storyforge-web-v4-html-prototype-2026-03-22/assets/styles.css
View File

@@ -293,9 +293,9 @@ select {
.screen-head p {
margin: 0;
color: var(--muted);
font-size: 14px;
line-height: 1.55;
max-width: 720px;
font-size: 13px;
line-height: 1.45;
max-width: 560px;
}
.action-row {
@@ -307,7 +307,8 @@ select {
.btn {
border: none;
border-radius: 12px;
padding: 11px 14px;
padding: 10px 13px;
font-size: 13px;
cursor: pointer;
}
@@ -368,7 +369,8 @@ select {
.panel-subtitle {
margin-top: 6px;
color: var(--muted);
font-size: 12px;
font-size: 11px;
line-height: 1.4;
}
.stat-card {
@@ -439,8 +441,8 @@ select {
.review-card p {
margin: 0;
color: var(--muted);
line-height: 1.5;
font-size: 12px;
line-height: 1.4;
font-size: 11px;
}
.task-meta,

126
output/ui/storyforge-web-v4-html-prototype-2026-03-22/index.html
View File

@@ -101,9 +101,9 @@
<span>⌕</span>
<input value="搜索项目、账号、作品、Agent 或任务" />
</label>
<span class="top-pill">流程正常 7/8</span>
<span class="top-pill">跟踪更新 12</span>
<span class="top-pill">待调研 Agent 4</span>
<span class="top-pill">流程 7/8</span>
<span class="top-pill">更新 12</span>
<span class="top-pill">待调研 4</span>
<div class="avatar">KR</div>
</div>
</div>
@@ -115,8 +115,8 @@
<p>先做最能推进项目的事。</p>
</div>
<div class="action-row">
<button class="btn btn-secondary">新建预调研项目</button>
<button class="btn btn-secondary">导入参考主页 / 作品</button>
<button class="btn btn-secondary">新建项目</button>
<button class="btn btn-secondary">导入对标</button>
<button class="btn btn-primary">创建 Agent</button>
</div>
</div>
@@ -147,8 +147,8 @@
<div class="layout-grid grid-main" style="margin-top: 18px;">
<div class="side-stack">
<div class="hero-card">
<h3>主业务流已经前置</h3>
<p>项目 -> Agent -> 调研 -> 导入绑定 -> 生产 -> 复盘。</p>
<h3>主流程</h3>
<p>项目 -> Agent -> 调研 -> 导入 -> 生产 -> 复盘</p>
<div class="chip-row" style="margin-top:14px;">
<span class="chip active">1. 我的项目</span>
<span class="chip">2. 创建 Agent</span>
@@ -163,14 +163,14 @@
<div class="panel-head">
<div>
<h3>今日重点动作</h3>
<div class="panel-subtitle">按主流程排</div>
<div class="panel-subtitle">按优先级</div>
</div>
<span class="tag blue">优先执行 4 项</span>
</div>
<div class="list">
<div class="task-item">
<h4>为“副业增长实验室”新建预调研项目</h4>
<p>先开项目，后面再补账号绑定。</p>
<p>先开项目，再补账号绑定。</p>
<div class="task-meta">
<span class="tag blue">项目</span>
<span class="tag">预调研</span>
@@ -179,7 +179,7 @@
</div>
<div class="task-item">
<h4>给“教育切片增长助手”补完平台与变现定义</h4>
<p>补齐平台和变现方式后再跑首轮调研。</p>
<p>补齐平台和变现后再跑调研。</p>
<div class="task-meta">
<span class="tag blue">Agent 创建</span>
<span class="tag">待补字段</span>
@@ -187,7 +187,7 @@
</div>
<div class="task-item">
<h4>把 5 条新导入的抖音作品交给导入分析 Agent 自动归类</h4>
<p>统一由导入分析 Agent 判断归属。</p>
<p>交给导入分析 Agent 判归属。</p>
<div class="task-meta">
<span class="tag orange">导入分析 Agent</span>
<span class="tag">自动绑定</span>
@@ -195,7 +195,7 @@
</div>
<div class="task-item">
<h4>补齐 2 条待生产内容的封面生成方案</h4>
<p>先补封面多模型对比，再进正式生产。</p>
<p>先补封面对比，再进生产。</p>
<div class="task-meta">
<span class="tag red">封面生成</span>
<span class="tag">多模型对比</span>
@@ -207,8 +207,8 @@
<div class="panel pad">
<div class="panel-head">
<div>
<h3>最近发现的高分账号</h3>
<div class="panel-subtitle">先选要学的号</div>
<h3>高分对标</h3>
<div class="panel-subtitle">先选要学的</div>
</div>
<span class="tag">找对标</span>
</div>
@@ -262,7 +262,7 @@
<div class="panel-head">
<div>
<h3>跟踪日报</h3>
<div class="panel-subtitle">汇总自上次打开后的更新</div>
<div class="panel-subtitle">自上次打开后</div>
</div>
<span class="tag blue">5 天汇总</span>
</div>
@@ -289,8 +289,8 @@
<div class="side-stack">
<div class="hero-card">
<h3>本周内容计划</h3>
<p>本周重点是把“高信任知识切片”做稳定。</p>
<h3>本周计划</h3>
<p>先把“高信任知识切片”做稳。</p>
<div class="mini-grid">
<div class="mini-card">
<small>待生成选题</small>
@@ -314,8 +314,8 @@
<div class="panel pad">
<div class="panel-head">
<div>
<h3>最近同步的高分作品</h3>
<div class="panel-subtitle">直接找可复制打法</div>
<h3>高分内容</h3>
<div class="panel-subtitle">直接找可复制点</div>
</div>
</div>
<div class="list">
@@ -344,7 +344,7 @@
<div class="panel-head">
<div>
<h3>异常提醒</h3>
<div class="panel-subtitle">先处理阻塞项</div>
<div class="panel-subtitle">先处理阻塞</div>
</div>
</div>
<div class="list">
@@ -369,15 +369,15 @@
<p>先建项目，再决定是否绑定自己的账号。</p>
</div>
<div class="action-row">
<button class="btn btn-secondary">绑定我的账号</button>
<button class="btn btn-secondary">导入参考主页 / 作品</button>
<button class="btn btn-secondary">绑定账号</button>
<button class="btn btn-secondary">导入对标</button>
<button class="btn btn-primary">新建项目</button>
</div>
</div>
<div class="hero-card">
<h3>推荐流程</h3>
<p>建项目 → 建 Agent → 跑调研 → 导入绑定 → 开始生产。</p>
<p>建项目 → 建 Agent → 跑调研 → 导入 → 开始生产</p>
<div class="chip-row" style="margin-top: 14px;">
<span class="chip active">项目</span>
<span class="chip">账号接入</span>
@@ -394,7 +394,7 @@
<div class="panel-head">
<div>
<h3>项目状态</h3>
<div class="panel-subtitle">预调研项目也能先跑</div>
<div class="panel-subtitle">预调研也能先跑</div>
</div>
</div>
<div class="three-col">
@@ -429,7 +429,7 @@
<div class="panel-head">
<div>
<h3>导入中心</h3>
<div class="panel-subtitle">导入后直接进入学习链路</div>
<div class="panel-subtitle">导入后直接进入学习</div>
</div>
</div>
<div class="three-col">
@@ -464,13 +464,13 @@
<div class="panel-head">
<div>
<h3>导入绑定策略</h3>
<div class="panel-subtitle">导入时就定归属</div>
<div class="panel-subtitle">导入时定归属</div>
</div>
</div>
<div class="list">
<div class="task-item">
<h4>手动关联 Agent</h4>
<p>你知道归属时就直接指定。</p>
<p>已知归属时直接指定。</p>
<div class="task-meta">
<span class="tag blue">导入前选择</span>
<span class="tag">最稳妥</span>
@@ -478,7 +478,7 @@
</div>
<div class="task-item">
<h4>自动关联最近使用 Agent</h4>
<p>适合连续导入同一批内容。</p>
<p>适合连续导入同批内容。</p>
<div class="task-meta">
<span class="tag orange">半自动</span>
<span class="tag">效率更高</span>
@@ -486,7 +486,7 @@
</div>
<div class="task-item">
<h4>暂不绑定，进入待归类池</h4>
<p>信息不全时，先放待归类池。</p>
<p>信息不全时先放待归类。</p>
<div class="task-meta">
<span class="tag red">待归类</span>
<span class="tag">需要人工确认</span>
@@ -501,7 +501,7 @@
<div class="panel-head">
<div>
<h3>平台账号同步</h3>
<div class="panel-subtitle">先绑自己的账号，系统才有现状分析</div>
<div class="panel-subtitle">先绑账号再看现状</div>
</div>
</div>
<div class="list">
@@ -524,7 +524,7 @@
<div class="panel-head">
<div>
<h3>最近导入队列</h3>
<div class="panel-subtitle">统一交给导入分析 Agent</div>
<div class="panel-subtitle">统一交给导入 Agent</div>
</div>
</div>
<div class="list">
@@ -555,9 +555,9 @@
<p>在这里找值得持续学习的对标账号。</p>
</div>
<div class="action-row">
<button class="btn btn-secondary">保存当前筛选</button>
<button class="btn btn-secondary">批量导入到项目</button>
<button class="btn btn-primary">生成初步分析并绑定 Agent</button>
<button class="btn btn-secondary">保存筛选</button>
<button class="btn btn-secondary">批量导入</button>
<button class="btn btn-primary">分析并绑定</button>
</div>
</div>
@@ -673,7 +673,7 @@
<div class="panel-head">
<div>
<h3>当前选中对标</h3>
<div class="panel-subtitle">点开对标后，直接在这里看详情和动作</div>
<div class="panel-subtitle">点开后直接看详情和动作</div>
</div>
<span class="tag blue">阿元创业手记</span>
</div>
@@ -735,7 +735,7 @@
<div class="panel-head">
<div>
<h3>相似对标</h3>
<div class="panel-subtitle">别只学一个号</div>
<div class="panel-subtitle">别只学一个</div>
</div>
</div>
<div class="list">
@@ -762,14 +762,14 @@
</div>
<div class="action-row">
<button class="btn btn-secondary">立即刷新</button>
<button class="btn btn-secondary">查看本次日报</button>
<button class="btn btn-secondary">查看日报</button>
<button class="btn btn-primary">新增跟踪账号</button>
</div>
</div>
<div class="hero-card">
<h3>日报逻辑</h3>
<p>系统按“上次打开后”或“最近一次已读日报后”的更新做汇总。用户 5 天没登录，这里就自动汇总 5 天的更新，再由你创建的 Agent 给出借鉴点。</p>
<p>按上次打开后汇总更新。5 天没登录，就看 5 天汇总，再由 Agent 标借鉴点。</p>
<div class="chip-row" style="margin-top:14px;">
<span class="chip active">按上次打开汇总</span>
<span class="chip">支持多天补报</span>
@@ -783,7 +783,7 @@
<div class="panel-head">
<div>
<h3>跟踪列表</h3>
<div class="panel-subtitle">手动选择要长期盯的账号</div>
<div class="panel-subtitle">手动选择长期跟踪</div>
</div>
<span class="tag">共 18 个</span>
</div>
@@ -818,7 +818,7 @@
<div class="panel-head">
<div>
<h3>本次汇总范围</h3>
<div class="panel-subtitle">不是“今日固定日报”，而是“自上次打开后的更新”</div>
<div class="panel-subtitle">不是自然日，而是上次打开后</div>
</div>
</div>
<div class="three-col">
@@ -852,7 +852,7 @@
<div class="panel-head">
<div>
<h3>更新日报</h3>
<div class="panel-subtitle">打开平台后先看这一组更新</div>
<div class="panel-subtitle">打开平台先看这组更新</div>
</div>
<span class="tag blue">汇总 5 天</span>
</div>
@@ -888,7 +888,7 @@
<div class="panel-head">
<div>
<h3>自动流程规则</h3>
<div class="panel-subtitle">让跟踪更像运营动作，而不是临时爬一眼</div>
<div class="panel-subtitle">把跟踪变成日常动作</div>
</div>
</div>
<div class="list">
@@ -914,12 +914,12 @@
<div class="screen-head">
<div>
<h2>自动流程</h2>
<p>这里不是做内容生产，而是让系统自动跑那些你不想每天手动点的事。</p>
<p>把同步、日报、补跑和提醒交给系统。</p>
</div>
<div class="action-row">
<button class="btn btn-secondary">查看计划</button>
<button class="btn btn-secondary">查看异常</button>
<button class="btn btn-primary">新建自动流程</button>
<button class="btn btn-primary">新建流程</button>
</div>
</div>
@@ -927,8 +927,8 @@
<div class="entity-cell">
<div class="avatar-lg">⚙</div>
<div>
<h3>自动流程是干什么的</h3>
<p>用来自动同步账号、抓取跟踪更新、生成日报、刷新学习集、补跑失败任务和发异常提醒。它更像后台助手，不是给用户直接写内容的地方。</p>
<h3>自动流程</h3>
<p>负责自动同步、生成日报、补跑失败任务和提醒异常。</p>
</div>
</div>
<div class="mini-grid">
@@ -945,7 +945,7 @@
<div class="panel-head">
<div>
<h3>常用自动流程</h3>
<div class="panel-subtitle">这些适合开成后台持续运行</div>
<div class="panel-subtitle">适合后台持续运行</div>
</div>
</div>
<div class="three-col">
@@ -980,7 +980,7 @@
<div class="panel-head">
<div>
<h3>当前流程列表</h3>
<div class="panel-subtitle">按后台计划持续执行</div>
<div class="panel-subtitle">按计划持续执行</div>
</div>
</div>
<div class="list">
@@ -1164,14 +1164,14 @@
</div>
<div class="action-row">
<button class="btn btn-secondary">新建 Playbook</button>
<button class="btn btn-secondary">运行首轮调研</button>
<button class="btn btn-secondary">跑首轮调研</button>
<button class="btn btn-primary">创建 Agent</button>
</div>
</div>
<div class="hero-card">
<h3>Agent 创建前置信息</h3>
<p>先定平台、变现方式和主模型，再跑首轮调研。</p>
<h3>创建前置</h3>
<p>先定平台、变现和主模型，再跑首轮调研。</p>
<div class="chip-row" style="margin-top:14px;">
<span class="chip active">先选项目</span>
<span class="chip">定义账号类型</span>
@@ -1187,7 +1187,7 @@
<div class="panel-head">
<div>
<h3>策略资产与 Playbook</h3>
<div class="panel-subtitle">打法资产继续保留，但服务于 Agent</div>
<div class="panel-subtitle">打法资产服务于 Agent</div>
</div>
</div>
<div class="playbook-list">
@@ -1210,7 +1210,7 @@
<div class="panel-head">
<div>
<h3>Agent 创建器</h3>
<div class="panel-subtitle">先定目标，再调研，再产出</div>
<div class="panel-subtitle">先定目标，再调研</div>
</div>
</div>
<div class="two-col">
@@ -1305,7 +1305,7 @@
<div class="panel-head">
<div>
<h3>已创建 Agent</h3>
<div class="panel-subtitle">导入分析也由专门 Agent 负责</div>
<div class="panel-subtitle">导入分析也交给 Agent</div>
</div>
</div>
<div class="list">
@@ -1347,10 +1347,10 @@
<p>文案、封面、剪辑、AI 视频和作品沉淀统一放在这里。</p>
</div>
<div class="action-row">
<button class="btn btn-secondary">批量生成封面</button>
<button class="btn btn-secondary">查看作品与成片</button>
<button class="btn btn-secondary">查看异常</button>
<button class="btn btn-primary">新建生产任务</button>
<button class="btn btn-secondary">批量封面</button>
<button class="btn btn-secondary">看作品</button>
<button class="btn btn-secondary">看异常</button>
<button class="btn btn-primary">新建任务</button>
</div>
</div>
@@ -1358,7 +1358,7 @@
<div class="panel-head">
<div>
<h3>生产队列</h3>
<div class="panel-subtitle">统一看生产进度</div>
<div class="panel-subtitle">统一看进度</div>
</div>
</div>
<div class="timeline">
@@ -1447,7 +1447,7 @@
<div class="panel-head">
<div>
<h3>生产瓶颈</h3>
<div class="panel-subtitle">把阻塞项直接亮出来</div>
<div class="panel-subtitle">直接看阻塞</div>
</div>
</div>
<div class="bar-chart">
@@ -1484,7 +1484,7 @@
<div class="panel-head">
<div>
<h3>流程运行与异常</h3>
<div class="panel-subtitle">先看哪里稳定，哪里要人工兜底</div>
<div class="panel-subtitle">先看哪里要人工兜底</div>
</div>
</div>
<div class="list">
@@ -1510,7 +1510,7 @@
<div class="panel-head">
<div>
<h3>作品与成片</h3>
<div class="panel-subtitle">生产中的内容和已经沉淀下来的作品都从这里看</div>
<div class="panel-subtitle">生产中和已沉淀内容都在这里</div>
</div>
</div>
<div class="list">
@@ -1538,7 +1538,7 @@
<div class="toolbar">
<div>
<h3 style="margin:0;">当前内容列表</h3>
<div class="panel-subtitle">从生产结果反看当前项目里最值得继续推进的内容</div>
<div class="panel-subtitle">从结果反看最值得推进的内容</div>
</div>
<div class="chip-row">
<span class="chip active">高分内容</span>