8376781864
Improve dashboard mobile log usability and make branch group cards collapsible for cleaner review workflows. - preserve/restore AgentLogViewer scroll position when toggling mobile drawer and lock body scroll while open - add collapse/expand state to BranchGroupCard with a summary header and hidden details when collapsed - add regression tests for AgentLogViewer mobile scroll behavior and BranchGroupCard collapse interactions - add a changeset and dashboard guide note for the new branch group card behavior Files changed: .changeset/fn-5845-branch-group-collapse.md | 5 ++ docs/dashboard-guide.md | 1 + .../dashboard/app/components/AgentLogViewer.tsx | 21 ++++++++ .../dashboard/app/components/BranchGroupCard.css | 23 ++++++++ .../dashboard/app/components/BranchGroupCard.tsx | 63 +++++++++++++++++----- .../components/__tests__/AgentLogViewer.test.tsx | 48 +++++++++++++++++ .../components/__tests__/BranchGroupCard.test.tsx | 18 +++++++ 7 files changed, 166 insertions(+), 13 deletions(-) Fusion-Task-Id: FN-5845 Fusion-Task-Lineage: 6a0f2967-5df8-4761-ae6c-50991f01ab78
107 lines
1.8 KiB
CSS
107 lines
1.8 KiB
CSS
.branch-group-card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--space-sm);
|
|
}
|
|
|
|
.branch-group-card-error {
|
|
color: var(--color-error);
|
|
}
|
|
|
|
.branch-group-card-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: var(--space-sm);
|
|
}
|
|
|
|
.branch-group-card-title {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.branch-group-card-header-meta {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.branch-group-card-badge {
|
|
background: var(--surface-elevated);
|
|
}
|
|
|
|
.branch-group-card-header-meta .btn {
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.branch-group-card-header-meta .btn-icon {
|
|
padding: calc(var(--space-xs) / 2);
|
|
}
|
|
|
|
.branch-group-card-header-meta .btn-icon svg {
|
|
display: block;
|
|
}
|
|
|
|
.branch-group-card-progress-text {
|
|
color: var(--text-muted);
|
|
font-size: var(--font-size-sm);
|
|
}
|
|
|
|
.branch-group-card-progress {
|
|
width: 100%;
|
|
height: var(--space-xs);
|
|
border-radius: var(--radius-pill);
|
|
background: var(--surface-elevated);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.branch-group-card-progress-fill {
|
|
display: block;
|
|
height: 100%;
|
|
background: var(--color-info);
|
|
}
|
|
|
|
.branch-group-card-members {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: calc(var(--space-xs) / 2);
|
|
}
|
|
|
|
.branch-group-card-member {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--space-xs);
|
|
}
|
|
|
|
.branch-group-card-member-title {
|
|
flex: 1;
|
|
}
|
|
|
|
.branch-group-card-member-status {
|
|
color: var(--text-muted);
|
|
display: inline-flex;
|
|
}
|
|
|
|
.branch-group-card-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--space-sm);
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
@media (max-width: 768px) {
|
|
.branch-group-card-header {
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.branch-group-card-header-meta {
|
|
width: 100%;
|
|
justify-content: space-between;
|
|
}
|
|
}
|