MobileEasyCook/easycook_mobile/lib/pages/auth/verifikasi_otp.dart
2024-12-31 09:53:57 +07:00

187 lines
6.3 KiB
Dart

import 'package:easycook_mobile/pages/auth/register.dart';
import 'package:easycook_mobile/pages/auth/reset_password.dart';
import 'package:easycook_mobile/theme.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';
class OTPPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
padding: EdgeInsets.only(top: 96, left: 16, right: 16, bottom: 63),
child: ListView(
children: [
Column(
children: [
// Title
Text(
'Verifikasi OTP',
style: GoogleFonts.montserrat().copyWith(
color: Colors.black,
fontWeight: FontWeight.bold,
fontSize: 32,
),
),
],
),
SizedBox(
height: 48,
),
// Gambar
Container(
child: SizedBox(
width: 207,
height: 198,
child: Image.asset('images/otp.png'),
),
),
SizedBox(
height: 56,
),
// Text
Container(
child: Text(
'Kode verifikasi telah dikirim ke nomor WhatsApp anda',
style: GoogleFonts.montserrat().copyWith(color: Colors.black),
textAlign: TextAlign.center,
),
),
SizedBox(
height: 30,
),
// OTP
Container(
padding: EdgeInsets.only(
left: 58,
right: 58,
),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
SizedBox(
height: 50,
width: 50,
child: TextFormField(
decoration: const InputDecoration(
border: OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.orange),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.amberAccent),
),
),
style: TextStyle(color: Colors.black),
autofocus: false,
),
),
SizedBox(
height: 50,
width: 50,
child: TextFormField(
decoration: const InputDecoration(
border: OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.orange),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.amberAccent),
),
),
style: TextStyle(color: Colors.black),
autofocus: false,
),
),
SizedBox(
height: 50,
width: 50,
child: TextFormField(
decoration: const InputDecoration(
border: OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.orange),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.amberAccent),
),
),
style: TextStyle(color: Colors.black),
autofocus: false,
),
),
SizedBox(
height: 50,
width: 50,
child: TextFormField(
decoration: const InputDecoration(
border: OutlineInputBorder(),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.orange),
),
focusedBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.amberAccent),
),
),
style: TextStyle(color: Colors.black),
autofocus: false,
),
),
],
),
),
SizedBox(
height: 32,
),
// Belum terkirim ?
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Text(
'Belum Terkirim?',
style: GoogleFonts.montserrat().copyWith(
color: Colors.black,
),
),
TextButton(
onPressed: () {},
child: Text(
'Kirim ulang',
style: GoogleFonts.montserrat(),
),
),
],
),
// Button
SizedBox(
height: 48,
width: 328,
child: TextButton(
style: TextButton.styleFrom(
backgroundColor: Colors.orange,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(20),
),
),
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => ResetPassword(),
),
);
},
child: Text(
'Kirim',
style: GoogleFonts.montserrat().copyWith(
color: Colors.white, fontWeight: FontWeight.bold),
),
),
),
],
),
),
);
}
}