Responsive And Touch Interaction

Gantt uses the same configuration on desktop and coarse-pointer devices. Touch interaction follows a select-then-edit model so ordinary swipes keep scrolling the task table or timeline.

• Tap a task bar to select it and reveal larger move, resize, progress, dependency, and split handles.
• Drag a selected bar or visible handle to edit.
• Keep the task table wide enough for at least the task name and one scheduling field.
• Allow the Gantt container to shrink with min-width: 0 inside flex and grid layouts.
• Use a fixed, viewport-derived, or parent-derived height; do not rely on content height.
• The packaged task editor becomes single-column and full-viewport on narrow screens.

.gantt-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  height: min(760px, calc(100vh - 8rem));
}

.gantt-shell revo-grid {
  display: block;
  min-width: 0;
  height: 100%;
}

Do not add page-level touch handlers that compete with Gantt pointer handling. Place application toolbars outside the scrollable grid container and verify edge swipes on unselected bars do not mutate tasks.