Best Value rows: capsule on its own line, comparison caption beneath

The verdict capsule shared a line with "vs closest eligible station"; the
caption's layoutPriority squeezed the capsule until it truncated
("Approx. £2.75 better off after tra…"), and in this sort mode the verdict
is the point of the row.

- The capsule now owns the line and the caption sits under it.
- The capsule text also shrinks rather than truncating at large Dynamic
  Type sizes, since nothing competes with it for width.
- The detail sheet keeps its side-by-side layout: it has the room, and the
  verdict there is the sheet's headline.
This commit is contained in:
FuelBoard Contributor
2026-10-15 22:25:53 +01:00
parent 5f3051aed7
commit ed3a5137cd
+17 -10
View File
@@ -107,16 +107,19 @@ struct FuelSavingsSummaryView: View {
// break even, blue baseline. lineLimit + minimumScaleFactor keep
// it to one line, so rows stay even.
VStack(alignment: .leading, spacing: 2) {
HStack(alignment: .firstTextBaseline, spacing: 6) {
capsule(for: result, compact: true)
.accessibilityLabel(accessibilityHeadline(for: result))
Text(comparisonLabel(for: result))
.font(.caption2)
.foregroundStyle(.secondary)
.lineLimit(1)
.layoutPriority(1)
.accessibilityLabel("Comparison: \(comparisonLabel(for: result))")
}
// The capsule gets the WHOLE line and the comparison caption
// sits beneath it. Side by side, the caption's layoutPriority
// squeezed the verdict until it truncated ("Approx. £2.75
// better off after tra…"), and in this sort mode the verdict
// is the point of the row.
capsule(for: result, compact: true)
.accessibilityLabel(accessibilityHeadline(for: result))
Text(comparisonLabel(for: result))
.font(.caption2)
.foregroundStyle(.secondary)
.lineLimit(1)
.minimumScaleFactor(0.85)
.accessibilityLabel("Comparison: \(comparisonLabel(for: result))")
if let warning = priceWarning ?? priceConfidence.warningText {
Text(warning)
.font(.caption2)
@@ -281,6 +284,10 @@ struct FuelSavingsSummaryView: View {
.accessibilityHidden(true)
Text(result.capsuleHeadline())
.lineLimit(1)
// Belt and braces: now that the capsule owns its line it has no
// rival for width, and shrinking beats truncating at large
// Dynamic Type sizes.
.minimumScaleFactor(0.8)
}
.font(compact ? .caption.weight(.semibold) : .headline)
.foregroundStyle(capsuleColor(for: result.status))