import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:go_router/go_router.dart';

class LoginWidget extends StatefulWidget {
  LoginWidget ({ Key? key }): super(key: key);
  @override LoginWidgetState createState() => LoginWidgetState();
}
class LoginWidgetState extends State<LoginWidget> {
  @override Widget build(BuildContext context) {
    return AlertDialog(
        backgroundColor: Colors.white,
        shape: const RoundedRectangleBorder(
                    borderRadius: BorderRadius.all(Radius.circular(0))),
        content: Padding(padding: const EdgeInsets.all(20), child: Column(mainAxisSize: MainAxisSize.min, children: [
      const Center(child: Padding( padding: EdgeInsets.only(bottom: 10), 
        child: Icon(Icons.person_search, size: 80, color: Colors.grey,))),
      const Center(child: Text("WELCOME ON OPENCLOUD", style: TextStyle(fontSize: 25, fontWeight: FontWeight.w600,
        color: Color.fromRGBO(38, 166, 154, 1)),)),
      Padding(padding: const EdgeInsets.symmetric(vertical: 20), child: Divider(color: Colors.grey.shade300,),),
      Container( margin: const EdgeInsets.only(bottom: 10), child: Center(child: Row( mainAxisAlignment: MainAxisAlignment.center,
        children: [ 
        Container( 
          width: MediaQuery.of(context).size.width / 3,
          alignment : Alignment.center,  
          child: TextField(
          decoration: InputDecoration(
            enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
            border: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
            focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
            hintText: "username...",
            contentPadding: const EdgeInsets.symmetric(horizontal: 20),
            fillColor: Colors.grey.shade300,
            filled: true,
            hintStyle: const TextStyle(fontSize: 12.5, color: Colors.grey)),
          style: const TextStyle(fontSize: 12.5, color: Colors.grey)),),
        Container(width: 50, height: 50, color: Colors.black, child: const Icon(Icons.person, color: Colors.white))
      ]))),
      Container( margin: const EdgeInsets.only(bottom: 20), child: Center(child: Row( mainAxisAlignment: MainAxisAlignment.center,
        children: [ 
        Container( 
          width: MediaQuery.of(context).size.width / 3,
          alignment : Alignment.center,  
          child: TextField(
          obscureText: true,
          decoration: InputDecoration(
            focusedBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
            enabledBorder: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
            border: OutlineInputBorder(borderSide: BorderSide(color: Colors.grey.shade300), borderRadius: BorderRadius.zero),
            hintText: "password...",
            contentPadding: const EdgeInsets.symmetric(horizontal: 20),
            fillColor: Colors.grey.shade300,
            filled: true,
            hintStyle: const TextStyle(fontSize: 12.5, color: Colors.grey)),
          style: const TextStyle(fontSize: 12.5, color: Colors.grey)),),
        Container(width: 50, height: 50, color: Colors.black, child: const Icon(Icons.password, color: Colors.white))
      ]))),
      Row( mainAxisAlignment: MainAxisAlignment.center, children: [
        Padding( padding: const EdgeInsets.only(right: 10), child: 
          InkWell(onTap: () { context.pop(); }, 
          mouseCursor: SystemMouseCursors.click,
          child: Container(
            margin: const EdgeInsets.only(top: 20),
            width: MediaQuery.of(context).size.width / 3,
            padding: const EdgeInsets.symmetric(vertical: 20),
            color: const Color.fromRGBO(38, 166, 154, 1), 
        child: const Center( child: Text("LOGIN", style: TextStyle(color: Colors.white, fontSize: 15),))))),
      ])
    ],)));
  }
}