Files
fusion/packages/dashboard/app/components/Board.css
Fusion Agent d9a4d36c1a FN-067: restore desktop Board drag navigation
Restore safe Board panning for desktop and tablet without changing mobile touch behavior.

- Restore primary-mouse dragging from safe noninteractive Board surfaces, including empty-column text.
- Keep cards, controls, editable content, native draggables, and mobile scrolling native.
- Preserve no edge auto-scroll behavior and document the updated navigation contract.

Files changed:
 .changeset/fn-067-board-safe-surface-pan.md        |   7 +
 docs/dashboard-guide.md                            |   4 +-
 packages/dashboard/app/components/Board.css        |   6 +-
 packages/dashboard/app/components/Board.tsx        |  12 +-
 .../app/components/__tests__/Board.test.tsx        |  73 +++++----
 .../app/components/__tests__/board-mobile.test.tsx |   4 +-
 .../app/hooks/__tests__/useBoardMousePan.test.tsx  | 163 +++++++++++----------
 packages/dashboard/app/hooks/useBoardMousePan.ts   |  37 +++--
 8 files changed, 172 insertions(+), 134 deletions(-)

Fusion-Task-Id: FN-067

Fusion-Task-Lineage: 410d3401-1d41-40f1-b025-26248ecd37ff

Co-authored-by: Fusion <noreply@runfusion.ai>
2026-08-21 04:32:52 +00:00

80 lines
1.9 KiB
CSS

/*
FNXC:BoardWorkflows 2026-06-20-09:02:
The board needs a neutral first-paint shell whenever workflow lanes are enabled but metadata is not ready, so users never see the legacy single-lane board flash before workflow lanes load.
*/
.board.board-workflows-skeleton {
display: flex;
align-items: stretch;
gap: var(--column-gap, var(--space-md));
overflow-x: auto;
overflow-y: hidden;
padding: var(--board-padding, var(--space-md));
background: var(--bg);
}
.board-workflows-skeleton__column {
flex: 1 0 min(24rem, 85vw);
min-width: min(24rem, 85vw);
display: flex;
flex-direction: column;
gap: var(--space-md);
padding: var(--space-md);
border: 1px solid var(--border);
background: var(--surface);
}
.board-workflows-skeleton__header,
.board-workflows-skeleton__card {
border-radius: var(--radius-md);
background: color-mix(in srgb, var(--border) 70%, var(--surface));
animation: board-workflows-skeleton-pulse 1.4s ease-in-out infinite;
}
.board-workflows-skeleton__header {
block-size: var(--space-lg);
inline-size: 55%;
}
.board-workflows-skeleton__card {
block-size: calc(var(--space-2xl) * 2);
inline-size: 100%;
}
.board-workflows-skeleton__card--short {
inline-size: 75%;
}
/*
FNXC:BoardNavigation 2026-08-20-04:47:
Feedback begins only after an eligible desktop/tablet safe-surface drag crosses horizontal intent.
It never activates for excluded cards or controls, the unbound skeleton, or the disabled mobile path.
*/
.board.board-workflow-columns.is-mouse-panning {
cursor: grabbing;
user-select: none;
}
@keyframes board-workflows-skeleton-pulse {
0%, 100% {
opacity: 0.55;
}
50% {
opacity: 1;
}
}
@media (max-width: 768px) {
.board.board-workflows-skeleton {
gap: var(--space-sm);
padding: var(--space-sm);
scroll-snap-type: x proximity;
}
.board-workflows-skeleton__column {
flex-basis: 86vw;
min-width: 86vw;
scroll-snap-align: center;
}
}