fixing inconsistencies in ui in onboarding

This commit is contained in:
talksik
2021-12-23 02:38:54 -08:00
parent 566574542f
commit 069cc543f4
5 changed files with 35 additions and 10 deletions
@@ -0,0 +1,21 @@
{
"images" : [
{
"filename" : "undraw_off_road_-9-oae.svg",
"idiom" : "universal",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"author" : "xcode",
"version" : 1
}
}
File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 61 KiB

@@ -36,7 +36,7 @@ struct PhoneCodeVerificationView: View {
ZStack(alignment: .topLeading) {
Color.clear
OnboardingTemplateView(hdrText: "Let's get you verified", imgName: "undraw_my_password_d-6-kg", bottomActArea: AnyView(
OnboardingTemplateView(hdrText: "Let's get you verified", imgName: "undraw_off_road_-9-oae", bottomActArea: AnyView(
VStack {
TextField("Code", text: self.$verificationCode)
.padding()
@@ -48,6 +48,9 @@ struct PhoneCodeVerificationView: View {
.padding(.vertical)
.keyboardType(.phonePad)
.focused(self.$focusedInputField)
Text("Please allow up to 30 seconds to receive your code. Navigate back and re-enter phone number if you do not get the message.")
.font(.caption)
.foregroundColor(NirvanaColor.teal)
if self.verificationCode.count == 6 {
@@ -138,12 +141,12 @@ struct PhoneCodeVerificationView: View {
.clipShape(Capsule())
.shadow(radius:10)
}
} else {
} else { // show dull button if didn't enter full phone number
Text("Verify")
.foregroundColor(Color.white.opacity(0.2))
.frame(maxWidth: .infinity)
.padding(.vertical, 20)
.background(Color.white.opacity(0.2)) // show dull button if didn't enter full phone number
.background(Color.white.opacity(0.2))
.clipShape(Capsule())
.shadow(radius:10)
.animation(.default)
@@ -40,7 +40,7 @@ struct PhoneVerificationView: View {
ZStack(alignment: .topLeading) {
Color.clear
OnboardingTemplateView(hdrText: "Let's get you verified", imgName: "undraw_my_password_d-6-kg", bottomActArea: AnyView(
OnboardingTemplateView(hdrText: "Let's get you verified", imgName: "undraw_off_road_-9-oae", bottomActArea: AnyView(
VStack {
HStack {
Text("+\(ccode)")
@@ -121,22 +121,22 @@ struct PhoneVerificationView: View {
.foregroundColor(Color.white)
.frame(maxWidth: .infinity)
.padding(.vertical, 20)
.background(NirvanaColor.teal) // show dull button if didn't enter full phone number
.background(NirvanaColor.teal)
.clipShape(Capsule())
.shadow(radius:10)
.animation(.default)
Text("You might receive an SMS message for verification and standard rates apply.")
.font(.footnote)
.foregroundColor(Color.black.opacity(0.5))
.font(.caption)
.foregroundColor(NirvanaColor.teal)
}
}
} else {
} else { // show dull button if didn't enter full phone number
Text("Send Verification")
.foregroundColor(Color.white.opacity(0.2))
.frame(maxWidth: .infinity)
.padding(.vertical, 20)
.background(Color.white.opacity(0.2)) // show dull button if didn't enter full phone number
.background(Color.white.opacity(0.2))
.clipShape(Capsule())
.shadow(radius:10)
.animation(.default)
@@ -21,7 +21,7 @@ struct WelcomeView: View {
self.navigationStack.push(PhoneVerificationView())
} label: {
Text("Start Your Detox")
.bold()
.fontWeight(.heavy)
.foregroundColor(NirvanaColor.white)
.frame(maxWidth: .infinity)
.padding(.vertical, 20)