diff --git a/mdc_100_series/lib/app.dart b/mdc_100_series/lib/app.dart index 8dae7098d5..6da53c4b39 100644 --- a/mdc_100_series/lib/app.dart +++ b/mdc_100_series/lib/app.dart @@ -75,6 +75,12 @@ ThemeData _buildShrineTheme() { color: kShrineBrown900 ), inputDecorationTheme: InputDecorationTheme( + focusedBorder: CutCornersBorder( + borderSide: BorderSide( + width: 2.0, + color: kShrineBrown900, + ), + ), border: CutCornersBorder(), ), textTheme: _buildShrineTextTheme(base.textTheme), diff --git a/mdc_100_series/lib/login.dart b/mdc_100_series/lib/login.dart index d01d26d122..b96c57e683 100644 --- a/mdc_100_series/lib/login.dart +++ b/mdc_100_series/lib/login.dart @@ -14,8 +14,6 @@ import 'package:flutter/material.dart'; -import 'colors.dart'; - class LoginPage extends StatefulWidget { @override _LoginPageState createState() => _LoginPageState(); @@ -24,6 +22,27 @@ class LoginPage extends StatefulWidget { class _LoginPageState extends State { final _usernameController = TextEditingController(); final _passwordController = TextEditingController(); + final _unfocusedColor = Colors.grey[600]; + final _usernameFocusNode = FocusNode(); + final _passwordFocusNode = FocusNode(); + + @override + void initState() { + super.initState(); + _usernameFocusNode + ..addListener(() { + setState(() { + //Redraw so that the username label reflects the focus state + }); + }); + + _passwordFocusNode + ..addListener(() { + setState(() { + //Redraw so that the password label reflects the focus state + }); + }); + } @override Widget build(BuildContext context) { @@ -44,25 +63,29 @@ class _LoginPageState extends State { ], ), SizedBox(height: 120.0), - AccentColorOverride( - color: kShrineBrown900, - child: TextField( - controller: _usernameController, - decoration: InputDecoration( - labelText: 'Username', - ), + TextField( + controller: _usernameController, + decoration: InputDecoration( + labelText: 'Username', + labelStyle: TextStyle( + color: _usernameFocusNode.hasFocus + ? Theme.of(context).accentColor + : _unfocusedColor), ), + focusNode: _usernameFocusNode, ), SizedBox(height: 12.0), - AccentColorOverride( - color: kShrineBrown900, - child: TextField( - controller: _passwordController, - decoration: InputDecoration( - labelText: 'Password', - ), - obscureText: true, + TextField( + controller: _passwordController, + decoration: InputDecoration( + labelText: 'Password', + labelStyle: TextStyle( + color: _passwordFocusNode.hasFocus + ? Theme.of(context).accentColor + : _unfocusedColor), ), + focusNode: _passwordFocusNode, + obscureText: true, ), ButtonBar( children: [ @@ -94,22 +117,3 @@ class _LoginPageState extends State { ); } } - -class AccentColorOverride extends StatelessWidget { - const AccentColorOverride({Key key, this.color, this.child}) - : super(key: key); - - final Color color; - final Widget child; - - @override - Widget build(BuildContext context) { - return Theme( - child: child, - data: Theme.of(context).copyWith( - accentColor: color, - brightness: Brightness.dark, - ), - ); - } -}