package views import ( "nebula/layouts" "nebula/models" ) templ LoginPage(state models.LoginState) { @layouts.CenteredCard("Sign In - Sonr") {
@LoginStepContent(state)
} } templ LoginStepContent(state models.LoginState) { switch state.Step { case "qr": @LoginQRStep() case "recovery": @LoginRecoveryStep() case "success": @LoginSuccessStep() default: @LoginStep1() } } templ LoginStepWithOOB(state models.LoginState) { @LoginStepContent(state) } templ LoginStep1() { @loginStyles()
@AuthMethodCard("passkey", "fingerprint", "Face or Fingerprint", "Use your face, fingerprint, or device PIN", false) @AuthMethodCard("security-key", "key", "Hardware Key", "Use a physical security key", false) @AuthMethodCard("qr-code", "qrcode", "Use Another Device", "Scan a QR code with your phone", false)
Can't sign in? Sign In
@loginStep1Scripts() } templ AuthMethodCard(method string, icon string, title string, description string, disabled bool) {
if method != "qr-code" { }
} templ LoginQRStep() { @loginStyles()

Or copy this link to your phone

Back
} templ LoginRecoveryStep() { @loginStyles()
Backup Code Phone
Back Recover
@recoveryScripts() } templ LoginSuccessStep() { @loginStyles()
Go to Dashboard
} templ QRStatusWaiting() {

Waiting for your phone...

} templ QRStatusSuccess() {

Phone connected!

} templ LoginFooter() {
Don't have an account? Create Account
} templ loginStyles() { } templ loginStep1Scripts() { } templ recoveryScripts() { }