import 'package:easycook_mobile/pages/auth/register.dart';
import 'package:easycook_mobile/pages/auth/verifikasi_otp.dart';
import 'package:easycook_mobile/theme.dart';
import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

class LupaSandiPage 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(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                // Title
                Text(
                  'Lupa Kata Sandi',
                  style: GoogleFonts.montserrat().copyWith(
                    color: Colors.black,
                    fontWeight: FontWeight.bold,
                    fontSize: 32,
                  ),
                ),
                SizedBox(
                  height: 32,
                ),
                // Gambar
                Container(
                  child: SizedBox(
                    width: 237,
                    height: 280,
                    child: Image.asset('images/lupa_kata_sandi.png'),
                  ),
                ),
                SizedBox(
                  height: 40,
                ),
                // Text Field
                Row(
                  children: [
                    Text(
                      'Masukan Nomor Telepon',
                      style: GoogleFonts.montserrat().copyWith(
                        color: Colors.black,
                        fontWeight: FontWeight.bold,
                        fontSize: 16,
                      ),
                    ),
                  ],
                ),
                SizedBox(
                  height: 6,
                ),
                TextFormField(
                  decoration: const InputDecoration(
                    border: OutlineInputBorder(),
                    enabledBorder: OutlineInputBorder(
                      borderSide: BorderSide(
                        color: Colors.black,
                        width: 1.5,
                      ),
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide(
                        color: Colors.blueAccent,
                        width: 3.0,
                      ),
                    ),
                    hintText: "Nomor Telepon",
                    hintStyle: TextStyle(color: Colors.black26),
                  ),
                  style: TextStyle(color: Colors.black),
                  autofocus: false,
                ),
                SizedBox(
                  height: 50,
                ),
                // 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) => OTPPage(),
                        ),
                      );
                    },
                    child: Text(
                      'Kirim Kode OTP',
                      style: GoogleFonts.montserrat().copyWith(
                          color: Colors.white, fontWeight: FontWeight.bold),
                    ),
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }
}