Unify capsule, station label and price rating styling

One adaptive tone palette and one shape rule now drive every capsule on
Stations, Favourites, the detail sheet and the Key.

- CapsuleTone: the light/dark palette pairs in one place, resolved through a
  UIColor dynamic provider so a List row that re-renders without rebuilding
  its body still follows an appearance switch. Every pair clears 4.5:1
  foreground-on-background in both appearances (4.96-6.72:1).
- AdaptiveCapsule: capsule at one drawn line, rounded rect at two or more,
  radius 8 -> 10, measuring content before padding so insets cannot inflate
  the line count.
- Listing verdict capsules move from white-on-muted-solid to the tinted
  palette, so Saves, Break even, Costs and Closest station read the same in
  the rows and in the detail sheet.
- Best Value is purple, not green: green stays reserved for a financial
  saving, which is what the Saves capsule beside it means.
- Price dots standardise to 12pt in the app (widget keeps its own 6pt dot;
  PriceRatingDot now takes a diameter so the difference is deliberate).
- Station labels are sentence case with their recommended symbols (medal, tag,
  location.north.fill, trophy) and StationLabelKind replaces the Key's
  string-literal dispatch, so renaming a label can no longer drop a row.
- Key says "Costs", matching the capsule's own headline (was "Costs more").
This commit is contained in:
FuelBoard Contributor
2026-10-19 11:39:54 +01:00
parent fcb11a8f52
commit 5d9e71f7ac
9 changed files with 427 additions and 227 deletions
+10 -13
View File
@@ -2084,29 +2084,26 @@ struct StationRow: View {
}
/// One recommendation badge, above the price it annotates. Badges stay
/// TINTED with coloured text — unlike the verdict capsules, which are filled
/// with white text: a badge annotates the price rather than reporting an
/// outcome, so it should stay quieter than the pill beneath it. Tinted text
/// also keeps its contrast in both appearances at every Dynamic Type size
/// without introducing a colour outside the palette.
/// TINTED with coloured text — unlike the verdict capsule beneath, which is
/// filled: a badge annotates the price rather than reporting an outcome, so it
/// stays quieter than the pill below it, and tinted text keeps its contrast in
/// both appearances at every Dynamic Type size.
private func badgeCapsule(_ badge: StationRecommendationBadge) -> some View {
StationLabelBadge(label: badge.title, color: badge.tint)
StationLabelBadge(kind: badge.labelKind)
}
}
/// Badge copy and colour for `StationRecommendationBadge` — view concerns, so
/// they stay out of the shared model the tests cover.
private extension StationRecommendationBadge {
var title: String {
/// The shared label kind, so a row's badge and the Key's legend for the same
/// meaning can never drift apart.
var labelKind: StationLabelKind {
switch self {
case .bestValue:
return String(localized: "BEST VALUE", comment: "Station badge: saving clears the Best Value threshold")
case .cheapest:
return String(localized: "CHEAPEST", comment: "Station badge: cheapest price in range")
case .bestValue: return .bestValue
case .cheapest: return .cheapest
}
}
var tint: Color { self == .bestValue ? .green : .blue }
}
// MARK: - Location manager