pretty nice phone input screen
This commit is contained in:
@@ -11,6 +11,7 @@ import NavigationStack
|
|||||||
// user can type in a phone number and then receive a text
|
// user can type in a phone number and then receive a text
|
||||||
struct PhoneVerificationView: View {
|
struct PhoneVerificationView: View {
|
||||||
@State var phoneNumber = ""
|
@State var phoneNumber = ""
|
||||||
|
@State var ccode = "+1"
|
||||||
@EnvironmentObject private var navigationStack: NavigationStack
|
@EnvironmentObject private var navigationStack: NavigationStack
|
||||||
|
|
||||||
var body: some View {
|
var body: some View {
|
||||||
@@ -20,18 +21,32 @@ struct PhoneVerificationView: View {
|
|||||||
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_my_password_d-6-kg", bottomActArea: AnyView(
|
||||||
VStack {
|
VStack {
|
||||||
HStack {
|
HStack {
|
||||||
TextField("enter phone number", text: $phoneNumber)
|
Text(ccode)
|
||||||
.background(Color.white.opacity(0.5))
|
.padding()
|
||||||
|
.background(.ultraThinMaterial)
|
||||||
|
.clipShape(Circle())
|
||||||
|
.shadow(color: Color.black.opacity(0.3), radius: 20, x: 0, y: 20)
|
||||||
|
|
||||||
TextField("enter phone number", text: $phoneNumber)
|
TextField("enter phone number", text: $phoneNumber)
|
||||||
.background(Color.white.opacity(0.5))
|
.padding()
|
||||||
|
.background(.ultraThinMaterial)
|
||||||
|
.clipShape(Capsule())
|
||||||
|
.keyboardType(.decimalPad)
|
||||||
|
.frame(maxWidth: .infinity)
|
||||||
|
.shadow(color: Color.black.opacity(0.3), radius: 20, x: 0, y: 20)
|
||||||
|
.font(.caption)
|
||||||
|
|
||||||
|
Spacer()
|
||||||
}
|
}
|
||||||
.padding(.vertical, 20)
|
.padding(.vertical, 20)
|
||||||
|
|
||||||
Button {
|
Button {
|
||||||
print("send verification")
|
print("send verification")
|
||||||
|
|
||||||
self.navigationStack.pop() // goes back to welcome screen
|
// do auth stuff
|
||||||
|
// then async send to next page
|
||||||
|
self.navigationStack.push(PhoneVerificationCodeView()) // verify code page
|
||||||
|
|
||||||
} label: {
|
} label: {
|
||||||
Text("Send Verification")
|
Text("Send Verification")
|
||||||
.bold()
|
.bold()
|
||||||
@@ -49,6 +64,7 @@ struct PhoneVerificationView: View {
|
|||||||
Button {
|
Button {
|
||||||
print("going back to last page")
|
print("going back to last page")
|
||||||
|
|
||||||
|
self.navigationStack.pop() // goes back to welcome screen
|
||||||
} label: {
|
} label: {
|
||||||
Label("Back", systemImage: "chevron.left")
|
Label("Back", systemImage: "chevron.left")
|
||||||
.labelStyle(.iconOnly)
|
.labelStyle(.iconOnly)
|
||||||
|
|||||||
@@ -33,7 +33,7 @@ struct WelcomeView: View {
|
|||||||
|
|
||||||
Link("Learn More", destination: URL(string: NirvanaConstants.landingPageUrl)!)
|
Link("Learn More", destination: URL(string: NirvanaConstants.landingPageUrl)!)
|
||||||
.font(.caption)
|
.font(.caption)
|
||||||
.foregroundColor(NirvanaColor.white)
|
.foregroundColor(NirvanaColor.teal)
|
||||||
|
|
||||||
//learn more button to usenirvana.com
|
//learn more button to usenirvana.com
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user