michael-login.dart

class Login extends StatefulWidget {
  @override
  _LoginState createState() => _LoginState();
}

class _LoginState extends State<Login> {
  
  InputDecoration inputDecoration({Icon icon, Icon sicon, String hintText}) {
    return InputDecoration(
      prefixIcon: icon,
      suffixIcon: sicon,
      hintText: '$hintText',
      hintStyle: TextStyle(color: Colors.red),
      fillColor: Colors.deepOrange.shade900,
      //border color when enabled
      enabledBorder: OutlineInputBorder(
        borderRadius: BorderRadius.all(Radius.circular(10)),
        borderSide: BorderSide(width: 1, color: Colors.white10),
      ),
      focusedBorder: OutlineInputBorder(
        borderRadius: BorderRadius.all(Radius.circular(4)),
        borderSide: BorderSide(width: 1, color: Colors.red.shade200),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.grey.shade800,
      body: Stack(
        children: <Widget>[
          Container(
            height: 300,
            decoration: BoxDecoration(
              color: Colors.deepOrange.shade900,
              borderRadius: BorderRadius.only(
                bottomLeft: Radius.circular(10.0),
                bottomRight: Radius.circular(10.0),
              ),
            ),
          ),
          SafeArea(
            child: ListView(
              children: <Widget>[
                Padding(
                  padding: const EdgeInsets.fromLTRB(30, 60, 0, 20),
                  child: Text(
                    'Let\'s start with login!',
                    style: TextStyle(
                      fontSize: 25,
                      fontWeight: FontWeight.bold,
                      color: Colors.white,
                    ),
                  ),
                ),
                Container(
                  margin: EdgeInsets.all(30),
                  padding: EdgeInsets.fromLTRB(20, 30, 20, 30),
                  decoration: BoxDecoration(
                    color: Colors.grey.shade900,
                    borderRadius: BorderRadius.circular(5),
                  ),
                  child: Column(
                    children: <Widget>[
                      TextFormField(
                        decoration: inputDecoration(
                          icon: Icon(Icons.person, color: Colors.red),
                          hintText: 'username',
                        ),
                      ),
                      SizedBox(height: 20),
                      //password field
                      TextFormField(
                        obscureText: true,
                        decoration: inputDecoration(
                          hintText: 'password',
                          icon: Icon(Icons.lock, color: Colors.red),
                          sicon: Icon(
                            Icons.remove_red_eye,
                            color: Colors.grey.shade700,
                          ),
                        ),
                      ),
                      SizedBox(height: 40),
                      //LOGIN button (TODO: let it accept gesture, eg: onpress)
                      Container(
                        width: double.infinity,
                        child: RaisedButton(
                          padding: EdgeInsets.all(12),
                          color: Colors.deepOrange.shade900,
                          shape: RoundedRectangleBorder(
                            borderRadius: BorderRadius.circular(18.0),
                            side: BorderSide(color: Colors.red),
                          ),
                          onPressed: () {
                            print('yaaay');
                          },
                          child: Text(
                            'Login',
                            style: TextStyle(
                              fontWeight: FontWeight.bold,
                              fontSize: 20,
                              color: Colors.white,
                            ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                FlatButton(
                  onPressed: () {},
                  child: Text(
                    'I\'ve forgotten my password',
                    style: TextStyle(
                      color: Colors.grey.shade500,
                      fontSize: 15,
                    ),
                  ),
                ),
                FlatButton(
                  onPressed: () {
                    print('I dont haave an account');
                  },
                  child: Text(
                    'I don\'t have an account',
                    style: TextStyle(
                      color: Colors.grey.shade500,
                      fontSize: 20,
                    ),
                  ),
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}