Adds some Shrine updates from Material team. (#34)

pull/36/head
Andrew Brogdon 6 years ago committed by GitHub
parent ee59e80324
commit 92f692583d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -50,7 +50,8 @@ class _ShrineAppState extends State<ShrineApp>
home: HomePage(
backdrop: Backdrop(
frontLayer: ProductPage(),
backLayer: CategoryMenuPage(onCategoryTap: () => _controller.forward()),
backLayer:
CategoryMenuPage(onCategoryTap: () => _controller.forward()),
frontTitle: Text('SHRINE'),
backTitle: Text('MENU'),
controller: _controller,
@ -85,6 +86,7 @@ IconThemeData _customIconTheme(IconThemeData original) {
ThemeData _buildShrineTheme() {
final ThemeData base = ThemeData.light();
return base.copyWith(
colorScheme: kShrineColorScheme,
accentColor: kShrineBrown900,
primaryColor: kShrinePink100,
buttonColor: kShrinePink100,
@ -92,9 +94,13 @@ ThemeData _buildShrineTheme() {
cardColor: kShrineBackgroundWhite,
textSelectionColor: kShrinePink100,
errorColor: kShrineErrorRed,
buttonTheme: ButtonThemeData(textTheme: ButtonTextTheme.accent),
primaryIconTheme: base.iconTheme.copyWith(color: kShrineBrown900),
inputDecorationTheme: InputDecorationTheme(border: CutCornersBorder()),
buttonTheme: const ButtonThemeData(
colorScheme: kShrineColorScheme,
textTheme: ButtonTextTheme.normal,
),
primaryIconTheme: _customIconTheme(base.iconTheme),
inputDecorationTheme:
const InputDecorationTheme(border: CutCornersBorder()),
textTheme: _buildShrineTextTheme(base.textTheme),
primaryTextTheme: _buildShrineTextTheme(base.primaryTextTheme),
accentTextTheme: _buildShrineTextTheme(base.accentTextTheme),
@ -105,9 +111,7 @@ ThemeData _buildShrineTheme() {
TextTheme _buildShrineTextTheme(TextTheme base) {
return base
.copyWith(
headline: base.headline.copyWith(
fontWeight: FontWeight.w500,
),
headline: base.headline.copyWith(fontWeight: FontWeight.w500),
title: base.title.copyWith(fontSize: 18.0),
caption: base.caption.copyWith(
fontWeight: FontWeight.w400,
@ -128,3 +132,19 @@ TextTheme _buildShrineTextTheme(TextTheme base) {
bodyColor: kShrineBrown900,
);
}
const ColorScheme kShrineColorScheme = ColorScheme(
primary: kShrinePink100,
primaryVariant: kShrineBrown900,
secondary: kShrinePink50,
secondaryVariant: kShrineBrown900,
surface: kShrineSurfaceWhite,
background: kShrineBackgroundWhite,
error: kShrineErrorRed,
onPrimary: kShrineBrown900,
onSecondary: kShrineBrown900,
onSurface: kShrineBrown900,
onBackground: kShrineBrown900,
onError: kShrineSurfaceWhite,
brightness: Brightness.light,
);

@ -22,33 +22,33 @@ class LoginPage extends StatefulWidget {
}
class _LoginPageState extends State<LoginPage> {
final _usernameController = TextEditingController();
final _passwordController = TextEditingController();
final TextEditingController _usernameController = TextEditingController();
final TextEditingController _passwordController = TextEditingController();
@override
Widget build(BuildContext context) {
return Scaffold(
body: SafeArea(
child: ListView(
padding: EdgeInsets.symmetric(horizontal: 24.0),
padding: const EdgeInsets.symmetric(horizontal: 24.0),
children: <Widget>[
SizedBox(height: 80.0),
const SizedBox(height: 80.0),
Column(
children: <Widget>[
Image.asset('assets/diamond.png'),
SizedBox(height: 16.0),
const SizedBox(height: 16.0),
Text(
'SHRINE',
style: Theme.of(context).textTheme.headline,
),
],
),
SizedBox(height: 120.0),
const SizedBox(height: 120.0),
PrimaryColorOverride(
color: kShrineBrown900,
child: TextField(
controller: _usernameController,
decoration: InputDecoration(
decoration: const InputDecoration(
labelText: 'Username',
),
),
@ -58,7 +58,7 @@ class _LoginPageState extends State<LoginPage> {
color: kShrineBrown900,
child: TextField(
controller: _passwordController,
decoration: InputDecoration(
decoration: const InputDecoration(
labelText: 'Password',
),
),
@ -66,8 +66,8 @@ class _LoginPageState extends State<LoginPage> {
ButtonBar(
children: <Widget>[
FlatButton(
child: Text('CANCEL'),
shape: BeveledRectangleBorder(
child: const Text('CANCEL'),
shape: const BeveledRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(7.0)),
),
onPressed: () {
@ -76,9 +76,9 @@ class _LoginPageState extends State<LoginPage> {
},
),
RaisedButton(
child: Text('NEXT'),
child: const Text('NEXT'),
elevation: 8.0,
shape: BeveledRectangleBorder(
shape: const BeveledRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(7.0)),
),
onPressed: () {

@ -19,7 +19,7 @@ import 'package:flutter/widgets.dart';
class CutCornersBorder extends OutlineInputBorder {
const CutCornersBorder({
BorderSide borderSide: BorderSide.none,
BorderSide borderSide: const BorderSide(),
BorderRadius borderRadius: const BorderRadius.all(Radius.circular(2.0)),
this.cut: 7.0,
double gapPadding: 2.0,

Loading…
Cancel
Save