ui: match empty player styling to playback controls

This commit is contained in:
2026-10-12 12:27:16 +02:00
parent 1e75f554f0
commit 39efa96986
2 changed files with 46 additions and 9 deletions
+44 -9
View File
@@ -1420,17 +1420,52 @@ private struct PlayerContent: View {
}
.frame(maxWidth: .infinity, maxHeight: .infinity)
} else if model.fileName == nil {
VStack(spacing: 14) {
Image(systemName: "play.rectangle").font(.system(size: 56, weight: .ultraLight))
.foregroundStyle(.white.opacity(0.65))
Text("terebi").font(.system(size: 22, weight: .medium))
Text("Drop a media file or YouTube link here").font(.callout).foregroundStyle(.secondary)
Button("Open File…", action: model.openPanel)
.buttonStyle(.bordered).controlSize(.large).disabled(!model.canOpen)
Button("Open YouTube URL…", action: model.openYouTubePanel)
.buttonStyle(.bordered).disabled(!model.canOpen)
VStack(spacing: 18) {
HStack(spacing: 12) {
Image(systemName: "play.rectangle.fill")
.font(.system(size: 28))
.frame(width: 40, height: 40)
.foregroundStyle(.white.opacity(0.6))
.accessibilityHidden(true)
VStack(alignment: .leading, spacing: 4) {
Text("terebi").font(.system(size: 20, weight: .semibold))
.foregroundStyle(.white.opacity(0.85))
Text("Open media to get started")
.font(.callout)
.foregroundStyle(.white.opacity(0.6))
}
Spacer(minLength: 0)
}
HStack(spacing: 0) {
Button(action: model.openPanel) {
Label("Open File…", systemImage: "doc")
.frame(maxWidth: .infinity, minHeight: 40)
.contentShape(Rectangle())
}
Divider().frame(height: 20).accessibilityHidden(true)
Button(action: model.openYouTubePanel) {
Label("YouTube URL…", systemImage: "link")
.frame(maxWidth: .infinity, minHeight: 40)
.contentShape(Rectangle())
}
.accessibilityLabel("Open YouTube URL…")
}
.font(.system(size: 13, weight: .medium))
.foregroundStyle(.white.opacity(0.85))
.imageScale(.large)
.buttonStyle(.plain)
.disabled(!model.canOpen)
.background(.white.opacity(0.06), in: RoundedRectangle(cornerRadius: 8))
Text("Drop a media file or YouTube link here")
.font(.system(size: 12))
.foregroundStyle(.white.opacity(0.6))
.multilineTextAlignment(.center)
}
.padding(20)
.frame(width: min(440, geometry.size.width - 48))
.background(PlayerGlass().clipShape(RoundedRectangle(cornerRadius: 12)).allowsHitTesting(false))
.frame(maxWidth: .infinity, maxHeight: .infinity)
.padding(.top, 32)
} else if !model.state.has_video && model.state.has_audio {
VStack(spacing: 16) {
Image(systemName: "waveform").font(.system(size: 64, weight: .ultraLight))