refactor(V0.2): 看板 ⋯ 沉到左下角; 列表负责人右下角, 去掉状态文字
Docker Build and Push / build-image (push) Successful in 59s

- 看板卡片左列改为上下撑满: 状态点在上, ⋯ 落到卡片左下角
- 列表行右列改为上下撑满: ⋯ 在右上, 负责人落到右下角
- 列表行第二行不再显示未开始/执行中/完成小字, 只留状态点与成员
This commit is contained in:
jif2.zhang
2026-10-25 02:40:02 +08:00
parent c0b55277a4
commit d20837f9f1
2 changed files with 12 additions and 7 deletions
+3 -4
View File
@@ -50,21 +50,20 @@ export default function TaskRow({
<div className="task-title">{task.title}</div> <div className="task-title">{task.title}</div>
<div className="task-meta"> <div className="task-meta">
<StatusDot status={task.status} /> <StatusDot status={task.status} />
<span>{statusLabel(task.status)}</span>
{task.members?.length > 0 && ( {task.members?.length > 0 && (
<span className="members">+ {task.members.map((m) => m.name).join('、')}</span> <span className="members">+ {task.members.map((m) => m.name).join('、')}</span>
)} )}
</div> </div>
</div> </div>
<div className="task-right"> <div className="task-right">
<span className={`assignee${task.assignee ? '' : ' none'}`}>
{task.assignee?.name || '未指派'}
</span>
<span <span
className="more" className="more"
onClick={(e) => { e.stopPropagation(); onMore?.(task) }} onClick={(e) => { e.stopPropagation(); onMore?.(task) }}
onPointerDown={(e) => e.stopPropagation()} onPointerDown={(e) => e.stopPropagation()}
>⋯</span> >⋯</span>
<span className={`assignee${task.assignee ? '' : ' none'}`}>
{task.assignee?.name || '未指派'}
</span>
</div> </div>
</> </>
)} )}
+9 -3
View File
@@ -1002,7 +1002,10 @@ body.me-safe-top .app-safe-top { height: 0; }
.task-meta .assignee { font-size: 12px; font-weight: 600; color: var(--color-text); } .task-meta .assignee { font-size: 12px; font-weight: 600; color: var(--color-text); }
.task-meta .assignee.none { color: #b8bcc4; font-weight: 400; } .task-meta .assignee.none { color: #b8bcc4; font-weight: 400; }
.task-meta .members { font-size: 10.5px; color: #a7adb6; } .task-meta .members { font-size: 10.5px; color: #a7adb6; }
.task-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; } .task-right {
display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between;
align-self: stretch; flex-shrink: 0;
}
.task-right .assignee { font-size: 12px; font-weight: 600; color: var(--color-text); } .task-right .assignee { font-size: 12px; font-weight: 600; color: var(--color-text); }
.task-right .assignee.none { color: #b8bcc4; font-weight: 400; } .task-right .assignee.none { color: #b8bcc4; font-weight: 400; }
.more { color: #c2c7cf; font-size: 16px; line-height: 1; padding: 0 2px; cursor: pointer; } .more { color: #c2c7cf; font-size: 16px; line-height: 1; padding: 0 2px; cursor: pointer; }
@@ -1049,8 +1052,11 @@ body.me-safe-top .app-safe-top { height: 0; }
box-shadow: 0 1px 2px rgba(0,0,0,.05); cursor: pointer; flex-shrink: 0; box-shadow: 0 1px 2px rgba(0,0,0,.05); cursor: pointer; flex-shrink: 0;
display: flex; gap: 7px; align-items: flex-start; display: flex; gap: 7px; align-items: flex-start;
} }
/* 左侧竖排操作列: 状态点 + ⋯ */ /* 左侧竖排操作列: 状态点在上, ⋯ 沉到左下角 */
.bcard-left { display: flex; flex-direction: column; align-items: center; gap: 7px; flex-shrink: 0; padding-top: 1px; } .bcard-left {
display: flex; flex-direction: column; align-items: center; flex-shrink: 0;
align-self: stretch; justify-content: space-between; padding: 1px 0 2px;
}
.bcard-body { flex: 1; min-width: 0; } .bcard-body { flex: 1; min-width: 0; }
.bcard.hl { outline: 2px solid var(--color-primary); outline-offset: 1px; } .bcard.hl { outline: 2px solid var(--color-primary); outline-offset: 1px; }
.brow1 { display: flex; align-items: flex-start; gap: 6px; } .brow1 { display: flex; align-items: flex-start; gap: 6px; }