I tried to add a bottom sheet on my login page so when the user click on forgot password it shows the bottom sheet and the user can enter its email.
Below is the code.
Button(action: {
if self.index == 0 {
showSheet.toggle()
}
}) {
if self.index == 0{
Text("Forget Password?")
.foregroundColor(FoodlooseColors.cOrange)
.fontWeight(.bold)
} else {
Text("Forget Password?")
.foregroundColor(.clear)
.fontWeight(.bold)
}
}
.sheet(isPresented: $showSheet) {
VStack() {
Text("Enter your email to reset your password")
.presentationDetents([.fraction(0.15)])
.padding(.top, 50)
HStack(spacing: 15){
Image(systemName: "envelope")
.foregroundColor(FoodlooseColors.cOrange)
TextField("Enter Email Address", text: self.$resetEmail)
}.padding(.vertical, 20)
Button(action: {
}, label : {
Text("Reset Password")
.frame(maxWidth: .infinity, maxHeight: 50)
})
.background(FoodlooseColors.cOrange)
.foregroundColor(.white)
.font(.system(size: 16, weight: .bold))
.clipShape(Capsule())
}
}
.padding(.top, 20)
but it looks like this:
As you can see it's compressed. I tried to use frame to change the size but nothing change.
Any idea?