Skip to content

Commit 858a23a

Browse files
sanchitmonga22sanchitmonga22
committed
UI updates
1 parent 011a06b commit 858a23a

14 files changed

Lines changed: 364 additions & 140 deletions

File tree

‎examples/ios/RunAnywhereAI/RunAnywhereAI/Assets.xcassets/AccentColor.colorset/Contents.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,15 @@
11
{
22
"colors" : [
33
{
4+
"color" : {
5+
"color-space" : "srgb",
6+
"components" : {
7+
"alpha" : "1.000",
8+
"blue" : "0x00",
9+
"green" : "0x55",
10+
"red" : "0xFF"
11+
}
12+
},
413
"idiom" : "universal"
514
}
615
],

‎examples/ios/RunAnywhereAI/RunAnywhereAI/Features/VoiceKeyboard/FlowActivationView.swift‎

Lines changed: 41 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@
77
//
88
// Purpose: Start the background AVAudioSession and instruct the user to swipe
99
// back to the host app. Dismisses automatically once the session is ready.
10+
// Branded with RunAnywhere color palette (#FF5500 primary accent).
1011
//
1112

1213
#if os(iOS)
@@ -22,7 +23,16 @@ struct FlowActivationView: View {
2223

2324
var body: some View {
2425
ZStack {
25-
Color(.systemBackground).ignoresSafeArea()
26+
// Brand gradient background
27+
LinearGradient(
28+
colors: [
29+
AppColors.backgroundPrimaryDark,
30+
AppColors.backgroundSecondaryDark
31+
],
32+
startPoint: .top,
33+
endPoint: .bottom
34+
)
35+
.ignoresSafeArea()
2636

2737
VStack(spacing: 0) {
2838
// MARK: Top Bar
@@ -34,9 +44,9 @@ struct FlowActivationView: View {
3444
} label: {
3545
Image(systemName: "xmark")
3646
.font(.system(size: 17, weight: .semibold))
37-
.foregroundStyle(.secondary)
47+
.foregroundStyle(.white.opacity(0.6))
3848
.padding(12)
39-
.background(Color(.systemGray5), in: Circle())
49+
.background(Color.white.opacity(0.1), in: Circle())
4050
}
4151
.padding(.trailing, 20)
4252
.padding(.top, 16)
@@ -50,10 +60,11 @@ struct FlowActivationView: View {
5060
case .activating:
5161
VStack(spacing: 12) {
5262
ProgressView()
63+
.tint(AppColors.primaryAccent)
5364
.scaleEffect(1.4)
54-
Text("Setting up microphone…")
65+
Text("Setting up microphone...")
5566
.font(.subheadline)
56-
.foregroundStyle(.secondary)
67+
.foregroundStyle(.white.opacity(0.6))
5768
}
5869
.frame(height: 60)
5970

@@ -62,10 +73,10 @@ struct FlowActivationView: View {
6273
VStack(spacing: 12) {
6374
Image(systemName: "exclamationmark.triangle.fill")
6475
.font(.title)
65-
.foregroundStyle(.orange)
76+
.foregroundStyle(AppColors.primaryAccent)
6677
Text(flowSession.lastError ?? "Could not start microphone")
6778
.font(.subheadline)
68-
.foregroundStyle(.secondary)
79+
.foregroundStyle(.white.opacity(0.6))
6980
.multilineTextAlignment(.center)
7081
.padding(.horizontal)
7182
}
@@ -75,17 +86,19 @@ struct FlowActivationView: View {
7586
// All preconditions met — instruct user to swipe back
7687
Text("Swipe back to continue")
7788
.font(.system(size: 28, weight: .bold))
89+
.foregroundStyle(.white)
7890
.multilineTextAlignment(.center)
7991
.frame(height: 60)
8092

8193
default:
8294
// .idle (initial) or .activating — show spinner
8395
VStack(spacing: 12) {
8496
ProgressView()
97+
.tint(AppColors.primaryAccent)
8598
.scaleEffect(1.4)
86-
Text("Setting up microphone…")
99+
Text("Setting up microphone...")
87100
.font(.subheadline)
88-
.foregroundStyle(.secondary)
101+
.foregroundStyle(.white.opacity(0.6))
89102
}
90103
.frame(height: 60)
91104
}
@@ -105,7 +118,7 @@ struct FlowActivationView: View {
105118
// MARK: Explanation Text
106119
Text("We wish you didn't have to switch apps to use RunAnywhere, but Apple requires this step to activate the microphone.")
107120
.font(.footnote)
108-
.foregroundStyle(.secondary)
121+
.foregroundStyle(.white.opacity(0.4))
109122
.multilineTextAlignment(.center)
110123
.padding(.horizontal, 40)
111124
.padding(.bottom, 48)
@@ -134,12 +147,22 @@ private struct PhoneIllustrationView: View {
134147

135148
var body: some View {
136149
ZStack {
137-
// Phone outline
150+
// Phone outline with brand-tinted border
138151
RoundedRectangle(cornerRadius: 28, style: .continuous)
139-
.fill(Color(.systemGray6))
152+
.fill(AppColors.backgroundTertiaryDark)
140153
.overlay(
141154
RoundedRectangle(cornerRadius: 28, style: .continuous)
142-
.strokeBorder(Color(.systemGray3), lineWidth: 2)
155+
.strokeBorder(
156+
LinearGradient(
157+
colors: [
158+
AppColors.primaryAccent.opacity(0.3),
159+
AppColors.primaryAccent.opacity(0.1)
160+
],
161+
startPoint: .topLeading,
162+
endPoint: .bottomTrailing
163+
),
164+
lineWidth: 2
165+
)
143166
)
144167

145168
// Phone screen content
@@ -152,14 +175,14 @@ private struct PhoneIllustrationView: View {
152175
Spacer()
153176
// Simulated keyboard strip
154177
RoundedRectangle(cornerRadius: 8)
155-
.fill(Color(.systemGray4))
178+
.fill(AppColors.backgroundGray5Dark)
156179
.frame(height: 70)
157180
.padding(.horizontal, 12)
158181
.overlay(
159182
HStack(spacing: 6) {
160-
ForEach(0..<4) { _ in
183+
ForEach(0..<4, id: \.self) { _ in
161184
RoundedRectangle(cornerRadius: 4)
162-
.fill(Color(.systemBackground))
185+
.fill(AppColors.backgroundSecondaryDark)
163186
.frame(height: 28)
164187
}
165188
}
@@ -178,7 +201,7 @@ private struct PhoneIllustrationView: View {
178201
VStack(spacing: 12) {
179202
Image(systemName: "waveform")
180203
.font(.system(size: 40, weight: .medium))
181-
.foregroundStyle(Color.accentColor)
204+
.foregroundStyle(AppColors.primaryAccent)
182205
// Swipe indicator — bottom center
183206
SwipeIndicator()
184207
.padding(.top, 20)
@@ -197,7 +220,7 @@ private struct SwipeIndicator: View {
197220

198221
var body: some View {
199222
Circle()
200-
.fill(Color.accentColor.opacity(0.7))
223+
.fill(AppColors.primaryAccent.opacity(0.7))
201224
.frame(width: 22, height: 22)
202225
.scaleEffect(isAnimating ? 1.25 : 0.9)
203226
.opacity(isAnimating ? 0.5 : 1.0)

‎examples/ios/RunAnywhereAI/RunAnywhereActivityExtension/Assets.xcassets/AccentColor.colorset/Contents.json‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,15 @@
11
{
22
"colors" : [
33
{
4+
"color" : {
5+
"color-space" : "srgb",
6+
"components" : {
7+
"alpha" : "1.000",
8+
"blue" : "0x00",
9+
"green" : "0x55",
10+
"red" : "0xFF"
11+
}
12+
},
413
"idiom" : "universal"
514
}
615
],

‎examples/ios/RunAnywhereAI/RunAnywhereActivityExtension/Assets.xcassets/runanywhere_icon.imageset/Contents.json‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
{
2+
"images" : [
3+
{
4+
"filename" : "runanywhere_icon@1x.png",
5+
"idiom" : "universal",
6+
"scale" : "1x"
7+
},
8+
{
9+
"filename" : "runanywhere_icon@2x.png",
10+
"idiom" : "universal",
11+
"scale" : "2x"
12+
},
13+
{
14+
"filename" : "runanywhere_icon@3x.png",
15+
"idiom" : "universal",
16+
"scale" : "3x"
17+
}
18+
],
19+
"info" : {
20+
"author" : "xcode",
21+
"version" : 1
22+
}
23+
}

‎examples/ios/RunAnywhereAI/RunAnywhereActivityExtension/Assets.xcassets/runanywhere_icon.imageset/runanywhere_icon@1x.png‎

2.47 KB
Loading

‎examples/ios/RunAnywhereAI/RunAnywhereActivityExtension/Assets.xcassets/runanywhere_icon.imageset/runanywhere_icon@2x.png‎

7.08 KB
Loading

‎examples/ios/RunAnywhereAI/RunAnywhereActivityExtension/Assets.xcassets/runanywhere_icon.imageset/runanywhere_icon@3x.png‎

13 KB
Loading

0 commit comments

Comments
 (0)