feat: add WCAG AA accessibility app-wide, fix CloudKit container config, remove debug logs
- Add VoiceOver labels, hints, and element grouping across all 60+ views - Add Reduce Motion support (Theme.Animation.prefersReducedMotion) to all animations - Replace fixed font sizes with semantic Dynamic Type styles - Hide decorative elements from VoiceOver with .accessibilityHidden(true) - Add .minimumHitTarget() modifier ensuring 44pt touch targets - Add AccessibilityAnnouncer utility for VoiceOver announcements - Improve color contrast values in Theme.swift for WCAG AA compliance - Extract CloudKitContainerConfig for explicit container identity - Remove PostHog debug console log from AnalyticsManager Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -40,6 +40,7 @@ struct HomeView: View {
|
||||
.font(.title2)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
}
|
||||
.accessibilityLabel("Create new trip")
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -198,6 +199,9 @@ struct HomeView: View {
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
}
|
||||
.minimumHitTarget()
|
||||
.accessibilityLabel("Refresh trips")
|
||||
.accessibilityHint("Fetches the latest featured trip recommendations")
|
||||
}
|
||||
.padding(.horizontal, Theme.Spacing.md)
|
||||
|
||||
@@ -210,6 +214,7 @@ struct HomeView: View {
|
||||
HStack(spacing: Theme.Spacing.xs) {
|
||||
Image(systemName: regionGroup.region.iconName)
|
||||
.font(.caption)
|
||||
.accessibilityHidden(true)
|
||||
Text(regionGroup.region.shortName)
|
||||
.font(.subheadline)
|
||||
}
|
||||
@@ -246,6 +251,7 @@ struct HomeView: View {
|
||||
HStack {
|
||||
Image(systemName: "exclamationmark.triangle")
|
||||
.foregroundStyle(.orange)
|
||||
.accessibilityLabel("Error loading trips")
|
||||
Text(error)
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.textSecondary(colorScheme))
|
||||
@@ -284,6 +290,7 @@ struct HomeView: View {
|
||||
Text("See All")
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
@@ -348,7 +355,9 @@ struct SavedTripCard: View {
|
||||
|
||||
Image(systemName: "map.fill")
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(trip.displayName)
|
||||
@@ -363,11 +372,13 @@ struct SavedTripCard: View {
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: "mappin")
|
||||
.font(.caption2)
|
||||
.accessibilityHidden(true)
|
||||
Text("\(trip.stops.count) cities")
|
||||
}
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: "sportscourt")
|
||||
.font(.caption2)
|
||||
.accessibilityHidden(true)
|
||||
Text("\(trip.totalGames) games")
|
||||
}
|
||||
}
|
||||
@@ -380,6 +391,7 @@ struct SavedTripCard: View {
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.foregroundStyle(Theme.textMuted(colorScheme))
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.padding(Theme.Spacing.md)
|
||||
.background(Theme.cardBackground(colorScheme))
|
||||
@@ -388,6 +400,7 @@ struct SavedTripCard: View {
|
||||
RoundedRectangle(cornerRadius: Theme.CornerRadius.medium)
|
||||
.stroke(Theme.surfaceGlow(colorScheme), lineWidth: 1)
|
||||
}
|
||||
.accessibilityElement(children: .combine)
|
||||
}
|
||||
.buttonStyle(.plain)
|
||||
}
|
||||
@@ -410,6 +423,7 @@ struct TipRow: View {
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.routeGold)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: 2) {
|
||||
Text(title)
|
||||
@@ -496,6 +510,7 @@ struct SavedTripsListView: View {
|
||||
Image(systemName: "plus.circle")
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
}
|
||||
.accessibilityLabel("Create poll")
|
||||
}
|
||||
}
|
||||
|
||||
@@ -522,6 +537,7 @@ struct SavedTripsListView: View {
|
||||
Image(systemName: "person.3")
|
||||
.font(.title)
|
||||
.foregroundStyle(Theme.textMuted(colorScheme))
|
||||
.accessibilityHidden(true)
|
||||
|
||||
Text("No group polls yet")
|
||||
.font(.subheadline)
|
||||
@@ -563,6 +579,7 @@ struct SavedTripsListView: View {
|
||||
Image(systemName: "suitcase")
|
||||
.font(.largeTitle)
|
||||
.foregroundColor(.secondary)
|
||||
.accessibilityHidden(true)
|
||||
|
||||
Text("No Saved Trips")
|
||||
.font(.headline)
|
||||
@@ -621,7 +638,9 @@ private struct PollRowCard: View {
|
||||
|
||||
Image(systemName: "chart.bar.doc.horizontal")
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: Theme.Spacing.xs) {
|
||||
Text(poll.title)
|
||||
@@ -644,6 +663,7 @@ private struct PollRowCard: View {
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.foregroundStyle(Theme.textMuted(colorScheme))
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.padding(Theme.Spacing.md)
|
||||
.background(Theme.cardBackground(colorScheme))
|
||||
@@ -676,6 +696,7 @@ struct SavedTripListRow: View {
|
||||
}
|
||||
}
|
||||
.frame(width: 20)
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: Theme.Spacing.xs) {
|
||||
Text(trip.displayName)
|
||||
@@ -703,6 +724,7 @@ struct SavedTripListRow: View {
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.foregroundStyle(Theme.textMuted(colorScheme))
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.padding(Theme.Spacing.lg)
|
||||
.background(Theme.cardBackground(colorScheme))
|
||||
@@ -712,6 +734,7 @@ struct SavedTripListRow: View {
|
||||
.stroke(Theme.surfaceGlow(colorScheme), lineWidth: 1)
|
||||
}
|
||||
.shadow(color: Theme.cardShadow(colorScheme), radius: 8, y: 4)
|
||||
.accessibilityElement(children: .combine)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -733,9 +756,11 @@ struct ProLockedView: View {
|
||||
.frame(width: 100, height: 100)
|
||||
|
||||
Image(systemName: "lock.fill")
|
||||
.font(.system(size: 40))
|
||||
.font(.largeTitle)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.accessibilityLabel("Pro feature locked")
|
||||
|
||||
VStack(spacing: Theme.Spacing.sm) {
|
||||
Text(feature.displayName)
|
||||
@@ -762,6 +787,7 @@ struct ProLockedView: View {
|
||||
.background(Theme.warmOrange)
|
||||
.foregroundStyle(.white)
|
||||
.clipShape(RoundedRectangle(cornerRadius: Theme.CornerRadius.medium))
|
||||
.accessibilityElement(children: .combine)
|
||||
}
|
||||
.padding(.horizontal, Theme.Spacing.xl)
|
||||
|
||||
|
||||
@@ -32,6 +32,7 @@ struct SuggestedTripCard: View {
|
||||
Image(systemName: sport.iconName)
|
||||
.font(.caption)
|
||||
.foregroundStyle(sport.themeColor)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -76,12 +77,14 @@ struct SuggestedTripCard: View {
|
||||
.stroke(Theme.surfaceGlow(colorScheme), lineWidth: 1)
|
||||
}
|
||||
.shadow(color: Theme.cardShadow(colorScheme), radius: 8, y: 4)
|
||||
.accessibilityElement(children: .combine)
|
||||
}
|
||||
|
||||
private var routePreview: some View {
|
||||
let cities = suggestedTrip.trip.stops.map { $0.city }
|
||||
let startCity = cities.first ?? ""
|
||||
let endCity = cities.last ?? ""
|
||||
let routeDescription = cities.joined(separator: " to ")
|
||||
|
||||
return VStack(alignment: .leading, spacing: Theme.Spacing.xs) {
|
||||
// Start → End display
|
||||
@@ -94,6 +97,7 @@ struct SuggestedTripCard: View {
|
||||
Image(systemName: "arrow.right")
|
||||
.font(.caption2)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
.accessibilityHidden(true)
|
||||
|
||||
Text(endCity)
|
||||
.font(.subheadline)
|
||||
@@ -108,11 +112,13 @@ struct SuggestedTripCard: View {
|
||||
Circle()
|
||||
.fill(index == 0 || index == cities.count - 1 ? Theme.warmOrange : Theme.routeGold.opacity(0.6))
|
||||
.frame(width: 6, height: 6)
|
||||
.accessibilityHidden(true)
|
||||
|
||||
if index < cities.count - 1 {
|
||||
Rectangle()
|
||||
.fill(Theme.routeGold.opacity(0.4))
|
||||
.frame(width: 8, height: 2)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -120,6 +126,8 @@ struct SuggestedTripCard: View {
|
||||
}
|
||||
.frame(height: 12)
|
||||
}
|
||||
.accessibilityElement(children: .ignore)
|
||||
.accessibilityLabel("Route: \(routeDescription)")
|
||||
}
|
||||
|
||||
private var regionColor: Color {
|
||||
|
||||
@@ -118,6 +118,8 @@ struct HomeContent_Classic: View {
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
}
|
||||
.minimumHitTarget()
|
||||
.accessibilityLabel("Refresh trips")
|
||||
}
|
||||
.padding(.horizontal, Theme.Spacing.md)
|
||||
|
||||
@@ -130,6 +132,7 @@ struct HomeContent_Classic: View {
|
||||
HStack(spacing: Theme.Spacing.xs) {
|
||||
Image(systemName: regionGroup.region.iconName)
|
||||
.font(.caption)
|
||||
.accessibilityHidden(true)
|
||||
Text(regionGroup.region.shortName)
|
||||
.font(.subheadline)
|
||||
}
|
||||
@@ -162,6 +165,7 @@ struct HomeContent_Classic: View {
|
||||
HStack {
|
||||
Image(systemName: "exclamationmark.triangle")
|
||||
.foregroundStyle(.orange)
|
||||
.accessibilityLabel("Error loading trips")
|
||||
Text(error)
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.textSecondary(colorScheme))
|
||||
@@ -200,6 +204,7 @@ struct HomeContent_Classic: View {
|
||||
Text("See All")
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
@@ -230,7 +235,9 @@ struct HomeContent_Classic: View {
|
||||
|
||||
Image(systemName: "map.fill")
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(trip.displayName)
|
||||
@@ -245,11 +252,13 @@ struct HomeContent_Classic: View {
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: "mappin")
|
||||
.font(.caption2)
|
||||
.accessibilityHidden(true)
|
||||
Text("\(trip.stops.count) cities")
|
||||
}
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: "sportscourt")
|
||||
.font(.caption2)
|
||||
.accessibilityHidden(true)
|
||||
Text("\(trip.totalGames) games")
|
||||
}
|
||||
}
|
||||
@@ -262,6 +271,7 @@ struct HomeContent_Classic: View {
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.foregroundStyle(Theme.textMuted(colorScheme))
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.padding(Theme.Spacing.md)
|
||||
.background(Theme.cardBackground(colorScheme))
|
||||
@@ -270,6 +280,7 @@ struct HomeContent_Classic: View {
|
||||
RoundedRectangle(cornerRadius: Theme.CornerRadius.medium)
|
||||
.stroke(Theme.surfaceGlow(colorScheme), lineWidth: 1)
|
||||
}
|
||||
.accessibilityElement(children: .combine)
|
||||
}
|
||||
|
||||
// MARK: - Tips Section
|
||||
@@ -306,6 +317,7 @@ struct HomeContent_Classic: View {
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.routeGold)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: 2) {
|
||||
Text(title)
|
||||
|
||||
@@ -117,6 +117,8 @@ struct HomeContent_ClassicAnimated: View {
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
}
|
||||
.minimumHitTarget()
|
||||
.accessibilityLabel("Refresh trips")
|
||||
}
|
||||
.padding(.horizontal, Theme.Spacing.md)
|
||||
|
||||
@@ -129,6 +131,7 @@ struct HomeContent_ClassicAnimated: View {
|
||||
HStack(spacing: Theme.Spacing.xs) {
|
||||
Image(systemName: regionGroup.region.iconName)
|
||||
.font(.caption)
|
||||
.accessibilityHidden(true)
|
||||
Text(regionGroup.region.shortName)
|
||||
.font(.subheadline)
|
||||
}
|
||||
@@ -161,6 +164,7 @@ struct HomeContent_ClassicAnimated: View {
|
||||
HStack {
|
||||
Image(systemName: "exclamationmark.triangle")
|
||||
.foregroundStyle(.orange)
|
||||
.accessibilityLabel("Error loading trips")
|
||||
Text(error)
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.textSecondary(colorScheme))
|
||||
@@ -199,6 +203,7 @@ struct HomeContent_ClassicAnimated: View {
|
||||
Text("See All")
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
@@ -229,7 +234,9 @@ struct HomeContent_ClassicAnimated: View {
|
||||
|
||||
Image(systemName: "map.fill")
|
||||
.foregroundStyle(Theme.warmOrange)
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: 4) {
|
||||
Text(trip.displayName)
|
||||
@@ -244,11 +251,13 @@ struct HomeContent_ClassicAnimated: View {
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: "mappin")
|
||||
.font(.caption2)
|
||||
.accessibilityHidden(true)
|
||||
Text("\(trip.stops.count) cities")
|
||||
}
|
||||
HStack(spacing: 4) {
|
||||
Image(systemName: "sportscourt")
|
||||
.font(.caption2)
|
||||
.accessibilityHidden(true)
|
||||
Text("\(trip.totalGames) games")
|
||||
}
|
||||
}
|
||||
@@ -261,6 +270,7 @@ struct HomeContent_ClassicAnimated: View {
|
||||
Image(systemName: "chevron.right")
|
||||
.font(.caption)
|
||||
.foregroundStyle(Theme.textMuted(colorScheme))
|
||||
.accessibilityHidden(true)
|
||||
}
|
||||
.padding(Theme.Spacing.md)
|
||||
.background(Theme.cardBackground(colorScheme))
|
||||
@@ -269,6 +279,7 @@ struct HomeContent_ClassicAnimated: View {
|
||||
RoundedRectangle(cornerRadius: Theme.CornerRadius.medium)
|
||||
.stroke(Theme.surfaceGlow(colorScheme), lineWidth: 1)
|
||||
}
|
||||
.accessibilityElement(children: .combine)
|
||||
}
|
||||
|
||||
// MARK: - Tips Section
|
||||
@@ -305,6 +316,7 @@ struct HomeContent_ClassicAnimated: View {
|
||||
.font(.subheadline)
|
||||
.foregroundStyle(Theme.routeGold)
|
||||
}
|
||||
.accessibilityHidden(true)
|
||||
|
||||
VStack(alignment: .leading, spacing: 2) {
|
||||
Text(title)
|
||||
|
||||
Reference in New Issue
Block a user