style: 工具栏重排——面包屑放大居左,流程名与统计移至右侧操作区旁

This commit is contained in:
yu 2026-10-28 17:08:40 +08:00
parent 69e9554250
commit e00a1e4743
2 changed files with 44 additions and 16 deletions

View File

@ -177,14 +177,17 @@ export function EditorPage({ catalog, onToast, onBack }: EditorPageProps) {
<section className="panel canvas-panel" aria-label="流程画布">
<div className="canvas-toolbar">
<div className="editor-breadcrumb">
<button type="button" className="back-link" onClick={onBack}>
<ArrowLeft className="icon" /> 任务中心
</button>
<span className="breadcrumb-sep">/</span>
<span className="breadcrumb-current">编辑流程</span>
</div>
<span className="spacer" />
<div className="flow-meta">
<div className="editor-breadcrumb">
<button type="button" className="back-link" onClick={onBack}>
<ArrowLeft className="icon" /> 任务中心
</button>
<span>/</span>
<span>编辑流程</span>
</div>
<input
className="flow-name"
value={flow.name}

View File

@ -593,12 +593,19 @@ textarea:focus-visible {
background: rgba(255, 255, 255, 0.94);
}
.canvas-toolbar .spacer {
flex: 1;
}
.flow-meta {
min-width: 0;
flex: 1;
flex: none;
max-width: 300px;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 2px;
margin-right: 6px;
}
.flow-name {
@ -610,7 +617,9 @@ textarea:focus-visible {
letter-spacing: -0.01em;
color: var(--ink);
min-width: 0;
width: 100%;
width: auto;
max-width: 100%;
text-align: right;
}
.flow-name:focus {
@ -621,6 +630,7 @@ textarea:focus-visible {
.flow-sub {
display: flex;
align-items: center;
justify-content: flex-end;
gap: 6px;
color: var(--muted);
font-size: 10.5px;
@ -3213,30 +3223,45 @@ textarea:focus-visible {
/* ---------- 编辑器返回路径与上下连线 ---------- */
.editor-breadcrumb {
min-height: 18px;
display: flex;
align-items: center;
gap: 5px;
gap: 7px;
color: var(--ink-2);
font-size: 12.5px;
flex: none;
}
.breadcrumb-sep {
color: var(--faint);
font-size: 10px;
font-size: 11.5px;
}
.breadcrumb-current {
color: var(--ink-2);
font-weight: 650;
}
.back-link {
display: inline-flex;
align-items: center;
gap: 4px;
gap: 5px;
color: var(--blue-dark);
font-size: 10px;
font-size: 12.5px;
font-weight: 650;
padding: 4px 8px;
margin-left: -8px;
border-radius: 8px;
transition: background 0.14s ease;
}
.back-link:hover {
color: var(--blue);
background: var(--blue-soft);
}
.back-link .icon {
width: 13px;
height: 13px;
width: 15px;
height: 15px;
}
.rpa-error-handle {