polish(stocktake-pdf): widen SKU→Name gap so the separation is visible

The previous 2% gapSkUName was too subtle to read as a column
separator — it was being absorbed by the empty space at the end
of the SKU column. Bumping to 4% (and trimming Name from 30%
to 28% to keep the total at 100%) makes the gap clearly visible
regardless of how long the SKU text is.

Co-authored-by: Orca <help@stably.ai>
This commit is contained in:
SJCoetz 2026-08-03 19:06:39 +02:00
parent b506670dde
commit 0cecc7208f

View file

@ -57,15 +57,15 @@ const styles = StyleSheet.create({
tdStatus: { fontSize: 9, fontFamily: "Helvetica-Bold", textAlign: "right" },
// The empty `gap*` styles are intentional separator columns. React-
// pdf's flexbox doesn't support per-child gaps, so we render the
// gaps as zero-content `<Text>` elements. The small gap between SKU
// and Name visually separates the identifier from the label; the
// larger gaps between Name/Supplier/Current/Min/Max push the numeric
// gaps as zero-content `<Text>` elements. The gap between SKU and
// Name visually separates the identifier from the label; the equal
// 4% gaps between Name/Supplier/Current/Min/Max push the numeric
// columns further to the right so the eye groups {SKU, Name,
// Supplier} as "what" and {Current, Min, Max, Status} as "how much
// / how urgent".
cSku: { width: "6%" },
gapSkuName: { width: "2%" },
cName: { width: "30%" },
gapSkuName: { width: "4%" },
cName: { width: "28%" },
gapNameSupplier: { width: "4%" },
cSupplier: { width: "11%" },
gapSupplierCurrent: { width: "4%" },