65ad41840f
Inspired by vtv/Dribbble streaming concept. Every dark surface replaced
with warm off-white (#F5F3F0) and white cards with soft shadows.
Design System: Warm off-white background, white card fills, subtle drop
shadows, dark text hierarchy, warm orange accent (#F27326) replacing
blue as primary interactive color. Added onDark color variants for hero
overlays. Shadow system with card/lifted states.
Navigation: Replaced TabView with inline CategoryPillBar — horizontal
orange pills (Today | Intel | Highlights | Multi-View | Settings).
Single scrolling view, no system chrome. Multi-View as icon button
with stream count badge. Settings as gear icon.
Stadium Hero: Full-bleed stadium photos from MLB CDN
(mlbstatic.com/v1/venue/{id}/spots/1200) as featured game background.
Left gradient overlay for text readability. Live games show score +
inning + DiamondView count/outs. Scheduled games show probable pitchers
with headshots + records. Final games show final score. Warm orange
"Watch Now" CTA pill. Added venue ID mapping for all 30 stadiums to
TeamAssets.
Game Cards: White cards with team color top bar, horizontal team rows,
dark text, soft shadows. Record + streak on every card.
Intel Tab: All dark panels replaced with white cards + shadows.
Replaced dark gradient screen background with flat warm off-white.
58 hardcoded .white.opacity() values replaced with DS.Colors tokens.
Feed Tab: Already used DS.Colors — inherits light theme automatically.
Focus: tvOS focus style uses warm orange border highlight + lifted
shadow instead of white glow on dark.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
69 lines
1.9 KiB
Swift
69 lines
1.9 KiB
Swift
import SwiftUI
|
|
|
|
enum DataPanelDensity {
|
|
case compact
|
|
case standard
|
|
case featured
|
|
|
|
var padding: CGFloat {
|
|
switch self {
|
|
case .compact: DS.Spacing.panelPadCompact
|
|
case .standard: DS.Spacing.panelPadStandard
|
|
case .featured: DS.Spacing.panelPadFeatured
|
|
}
|
|
}
|
|
|
|
var cornerRadius: CGFloat {
|
|
switch self {
|
|
case .compact: DS.Radii.compact
|
|
case .standard: DS.Radii.standard
|
|
case .featured: DS.Radii.featured
|
|
}
|
|
}
|
|
}
|
|
|
|
struct DataPanel<Content: View>: View {
|
|
let density: DataPanelDensity
|
|
var teamAccentCode: String? = nil
|
|
@ViewBuilder let content: () -> Content
|
|
|
|
var body: some View {
|
|
HStack(spacing: 0) {
|
|
if let code = teamAccentCode {
|
|
RoundedRectangle(cornerRadius: 1.5)
|
|
.fill(TeamAssets.color(for: code))
|
|
.frame(width: 3)
|
|
.padding(.vertical, 6)
|
|
.padding(.leading, 4)
|
|
}
|
|
|
|
VStack(alignment: .leading, spacing: 0) {
|
|
content()
|
|
}
|
|
.frame(maxWidth: .infinity, alignment: .leading)
|
|
.padding(density.padding)
|
|
}
|
|
.background(
|
|
RoundedRectangle(cornerRadius: density.cornerRadius)
|
|
.fill(DS.Colors.panelFill)
|
|
.shadow(color: DS.Shadows.card, radius: DS.Shadows.cardRadius, y: DS.Shadows.cardY)
|
|
)
|
|
.overlay(
|
|
RoundedRectangle(cornerRadius: density.cornerRadius)
|
|
.strokeBorder(DS.Colors.panelStroke, lineWidth: 0.5)
|
|
)
|
|
}
|
|
}
|
|
|
|
extension DataPanel {
|
|
init(
|
|
_ density: DataPanelDensity = .standard,
|
|
teamAccent: String? = nil,
|
|
@ViewBuilder content: @escaping () -> Content
|
|
) {
|
|
self.density = density
|
|
self.teamAccentCode = teamAccent
|
|
self.content = content
|
|
}
|
|
}
|