Defect #44595
closed
Gantt bars disappear in responsive layouts and progress segments are too wide at low percentages
Description
The Gantt chart has two rendering problems.
Responsive layout (899px)
Project and version bars disappear, and issue bars become shorter.
Low progress percentages (enlarged 4×)
The 3% progress segment is wider than the 4% segment.
Files
Updated by Katsuya HIDAKA 22 days ago
- File progress-after.png progress-after.png added
- File responsive-after.png responsive-after.png added
- File 0001-Fix-disappearing-Gantt-bars-in-responsive-layouts-and-oversized-progress-segments-at-low-percentages.patch 0001-Fix-disappearing-Gantt-bars-in-responsive-layouts-and-oversized-progress-segments-at-low-percentages.patch added
I'm attaching a patch that fixes both problems with border-box sizing and separates width calculations in Ruby from border sizing in CSS. This also allows future border changes without adjusting the width calculations.
- Explicitly apply
box-sizing: border-boxto Gantt bars. - Adjust bar heights to preserve their outer dimensions in the normal layout.
- Use the calculated bar widths without subtracting 2px.
Responsive layout after the patch
Progress widths after the patch (enlarged 4×)
Confirmed in Chrome, Safari, and Firefox on macOS. Visual regression tests found no new regressions across 46 scenarios. Full visual test report: https://redmine-gantt-comparison.hidakatsuya.chatgpt.site/
Note: Both problems affect Redmine 7.0.2. However, this patch is based on the updated Gantt implementation in #44567 and cannot be backported as is.
Updated by