refactor: make stats strip much more compact
Reduce vertical padding from 10→6pt, drop large icons, shrink font, value color now matches stat type (green/red/grey). Strip is ~40% shorter. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -26,7 +26,7 @@ struct BackupView: View {
|
||||
// ─── Compact stats strip (always visible) ─────────────
|
||||
statsStrip
|
||||
.padding(.horizontal, AppTheme.hPad)
|
||||
.padding(.bottom, 20)
|
||||
.padding(.bottom, 12)
|
||||
.transition(.opacity.combined(with: .scale(scale: 0.97)))
|
||||
|
||||
Spacer(minLength: 0)
|
||||
@@ -249,46 +249,43 @@ struct BackupView: View {
|
||||
// MARK: — Compact stats strip
|
||||
|
||||
private var statsStrip: some View {
|
||||
VStack(spacing: 8) {
|
||||
VStack(spacing: 5) {
|
||||
HStack(spacing: 0) {
|
||||
compactStat("\(engine.job.uploadedFiles)", label: "up", icon: "arrow.up.circle.fill", color: AppTheme.positive)
|
||||
compactStat("\(engine.job.uploadedFiles)", label: "up", color: AppTheme.positive)
|
||||
thinDivider
|
||||
compactStat("\(engine.job.skippedFiles)", label: "skip", icon: "minus.circle.fill", color: AppTheme.inkQuaternary)
|
||||
compactStat("\(engine.job.skippedFiles)", label: "skip", color: AppTheme.inkQuaternary)
|
||||
thinDivider
|
||||
compactStat("\(engine.job.failedFiles)", label: "err", icon: "xmark.circle.fill",
|
||||
compactStat("\(engine.job.failedFiles)", label: "err",
|
||||
color: engine.job.failedFiles > 0 ? AppTheme.destructive : AppTheme.inkQuaternary)
|
||||
thinDivider
|
||||
compactStat("\(max(0, engine.job.totalFiles - engine.job.uploadedFiles - engine.job.skippedFiles - engine.job.failedFiles))", label: "left", icon: "clock.fill", color: AppTheme.inkSecondary)
|
||||
compactStat("\(max(0, engine.job.totalFiles - engine.job.uploadedFiles - engine.job.skippedFiles - engine.job.failedFiles))", label: "left", color: AppTheme.inkSecondary)
|
||||
}
|
||||
.background(AppTheme.surfaceSunken)
|
||||
.clipShape(RoundedRectangle(cornerRadius: 10, style: .continuous))
|
||||
.clipShape(RoundedRectangle(cornerRadius: 8, style: .continuous))
|
||||
|
||||
pageIndicator
|
||||
}
|
||||
}
|
||||
|
||||
private func compactStat(_ value: String, label: String, icon: String, color: Color) -> some View {
|
||||
HStack(spacing: 5) {
|
||||
Image(systemName: icon)
|
||||
.font(.system(size: 10, weight: .medium))
|
||||
.foregroundStyle(color.opacity(0.7))
|
||||
private func compactStat(_ value: String, label: String, color: Color) -> some View {
|
||||
HStack(spacing: 4) {
|
||||
Text(value)
|
||||
.font(.system(size: 13, weight: .semibold))
|
||||
.foregroundStyle(AppTheme.ink)
|
||||
.font(.system(size: 12, weight: .semibold))
|
||||
.foregroundStyle(color)
|
||||
.monospacedDigit()
|
||||
Text(label)
|
||||
.font(.system(size: 10, weight: .regular))
|
||||
.foregroundStyle(AppTheme.inkTertiary)
|
||||
.foregroundStyle(AppTheme.inkQuaternary)
|
||||
}
|
||||
.frame(maxWidth: .infinity)
|
||||
.padding(.vertical, 10)
|
||||
.padding(.vertical, 6)
|
||||
}
|
||||
|
||||
private var thinDivider: some View {
|
||||
Rectangle()
|
||||
.fill(AppTheme.separator)
|
||||
.frame(width: 0.5)
|
||||
.padding(.vertical, 8)
|
||||
.padding(.vertical, 5)
|
||||
}
|
||||
|
||||
// MARK: — NAS status row
|
||||
|
||||
Reference in New Issue
Block a user