lekss361/gendesign
1
0
Fork 0
Code Issues 57 Pull requests Projects Releases Packages Wiki Activity Actions

fix(site-finder): visible by-quarter pipeline bars #167

Merged
lekss361 merged 1 commit from fix/pipeline-bar-height-rendering into main 2026-05-15 07:35:51 +00:00
Conversation 1 Commits 1 Files changed 1 +15 -5
1 changed files with 15 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
frontend/src/components/site-finder/Pipeline24moBlock.tsx
View file

@ -205,16 +205,25 @@ export function Pipeline24moBlock({ data }: Props) {
<div
style={{
display: "flex",
alignItems: "flex-end",
alignItems: "stretch",
gap: 4,
height: 80,
}}
>
{data.by_quarter.map((q) => {
const heightPct =
// Bar height in pixels of the 60px area above label row
// (reserves ~16px for label). Using fixed px avoids the
// align-items:flex-end shrink-to-content trap where %-heights
// would resolve to the column's content height instead of
// the outer 80px container.
const BAR_AREA_PX = 60;
const barPx =
maxFlatsPerQuarter > 0
? Math.max(6, (q.flats / maxFlatsPerQuarter) * 100)
: 6;
? Math.max(
4,
(q.flats / maxFlatsPerQuarter) * BAR_AREA_PX,
)
: 4;
return (
<div
key={q.quarter}
@ -222,6 +231,7 @@ export function Pipeline24moBlock({ data }: Props) {
flex: 1,
display: "flex",
flexDirection: "column",
justifyContent: "flex-end",
alignItems: "center",
gap: 3,
}}
@ -229,7 +239,7 @@ export function Pipeline24moBlock({ data }: Props) {
<div
style={{
width: "100%",
height: `${heightPct}%`,
height: barPx,
background: c.fg,
opacity: 0.5,
borderRadius: "3px 3px 0 0",