style: glow on NAS arc, darken ring tracks

Adds a blue-tinted shadow glow to the outer NAS progress arc for
visibility. Darkens track circles (0.92 → 0.76) and the middle
static ring (0.78 → 0.62). Bumps outer arc lineWidth to 1.5.

Co-Authored-By: Kutesir <kutesir@provoc.ug>
Co-Authored-By: Sentry <sentry@provoc.ug>
This commit is contained in:
Robin Kutesa
2026-05-19 18:34:33 +03:00
parent 99ca4a9e21
commit f59f79bad6

View File

@@ -1009,33 +1009,29 @@ private struct KisaniRingView: View {
let outerProgress: CGFloat let outerProgress: CGFloat
let innerProgress: CGFloat let innerProgress: CGFloat
private let track = Color(red: 0.92, green: 0.92, blue: 0.92) private let track = Color(red: 0.76, green: 0.76, blue: 0.76)
private let nasArc = Color(red: 0.42, green: 0.52, blue: 0.68)
var body: some View { var body: some View {
ZStack { ZStack {
// Outer track // Outer track
Circle().stroke(track, lineWidth: 1).padding(10) Circle().stroke(track, lineWidth: 1).padding(10)
// Outer progress (slate, animates) // Outer NAS progress (blue-slate + glow)
Circle().trim(from: 0, to: outerProgress) Circle().trim(from: 0, to: outerProgress)
.stroke( .stroke(nasArc, style: StrokeStyle(lineWidth: 1.5, lineCap: .round))
Color(red: 0.58, green: 0.64, blue: 0.73), .shadow(color: nasArc.opacity(0.65), radius: 7, x: 0, y: 0)
style: StrokeStyle(lineWidth: 1, lineCap: .round)
)
.rotationEffect(.degrees(-90)) .rotationEffect(.degrees(-90))
.padding(10) .padding(10)
.animation(.spring(response: 0.7, dampingFraction: 0.8), value: outerProgress) .animation(.spring(response: 0.7, dampingFraction: 0.8), value: outerProgress)
// Middle static ring (gray) // Middle static ring
Circle().stroke(Color(red: 0.78, green: 0.78, blue: 0.78), lineWidth: 1).padding(24) Circle().stroke(Color(red: 0.62, green: 0.62, blue: 0.62), lineWidth: 1).padding(24)
// Inner track // Inner track
Circle().stroke(track, lineWidth: 1.5).padding(38) Circle().stroke(track, lineWidth: 1.5).padding(38)
// Inner progress (green, animates) // Inner progress (green)
Circle().trim(from: 0, to: innerProgress) Circle().trim(from: 0, to: innerProgress)
.stroke( .stroke(AppTheme.positive, style: StrokeStyle(lineWidth: 1.5, lineCap: .round))
AppTheme.positive,
style: StrokeStyle(lineWidth: 1.5, lineCap: .round)
)
.rotationEffect(.degrees(-90)) .rotationEffect(.degrees(-90))
.padding(38) .padding(38)
.animation(.spring(response: 0.7, dampingFraction: 0.8), value: innerProgress) .animation(.spring(response: 0.7, dampingFraction: 0.8), value: innerProgress)