Skip to content

Instantly share code, notes, and snippets.

@scottbaggett
Created June 17, 2019 21:18
Show Gist options
  • Save scottbaggett/e45f0be8d7dfbfb94b6c4c684f771d01 to your computer and use it in GitHub Desktop.
Save scottbaggett/e45f0be8d7dfbfb94b6c4c684f771d01 to your computer and use it in GitHub Desktop.
import 'package:flutter/material.dart';
final ThemeData indigoTheme = _buildDefaultTheme();
final white = const Color(0xffffffff);
final black = const Color(0xFF000000);
final indigo = const Color(0xFF4957F4);
final splashColor = const Color(0x224957F4);
final brand = const Color(0xFF996D17);
final divider = const Color(0xFFCFCFCF);
final screenGrey = const Color(0xFFF6F6F6);
final lightGrey = const Color(0xFFCFCFCF);
final grey = const Color(0xFF7F7F7F);
final darkGrey = const Color(0xFF606060);
final darkestGrey = const Color(0xFF404040);
final errorRed = const Color(0xFFE75B52);
final inputGrey = const Color(0xFFefefef);
final buttonPrimaryFillColor = indigo;
final fontFamily = 'Calibre_R';
final baseLineHeight = 1.1;
/* ThemePadding class is a organizational structure that gives developers a simple,
reusable set of values and helpers */
class ThemePadding {
/* Base values can be used alone, but they also are used to construct
the full EdgeInsets below */
static const small = 4.0;
static const medium = 8.0;
static const large = 16.0;
/* This is the basic padding that is used for items in a list. */
static const insetPrimary =
EdgeInsets.symmetric(horizontal: large, vertical: medium);
/* Horizontal and vertical only EdgeInsets */
static const insetHorizontalSmall = EdgeInsets.symmetric(horizontal: small);
static const insetHorizontalMedium = EdgeInsets.symmetric(horizontal: medium);
static const insetHorizontalLarge = EdgeInsets.symmetric(horizontal: large);
static const insetVerticalSmall = EdgeInsets.symmetric(vertical: small);
static const insetVerticalMedium = EdgeInsets.symmetric(vertical: medium);
static const insetVerticalLarge = EdgeInsets.symmetric(vertical: large);
/* A unified amount of inset is often used for inner padding on containers. */
static const insetAllSmall = EdgeInsets.all(small);
static const insetAllMedium = EdgeInsets.all(medium);
static const insetAllLarge = EdgeInsets.all(large);
/* Floating Action Buttons are offset slightly from the bottom of the page for better iPhone X alignment */
static const fab =
EdgeInsets.only(bottom: ThemePadding.large, right: ThemePadding.medium);
}
/* Just like ThemePadding, ThemeBorder is a loose set of base
* values and helper constants. */
class ThemeBorder {
static const cardRadiusMedium = 6.0;
static const cardRadiusLarge = 10.0;
static const buttonRadius = 36.0;
}
class ThemeShadow {
static const base = 4.0;
/* Big Card shadows have a larger radius and lighter color than smaller cards */
static const cardBig = BoxShadow(
color: Color(0x20000000),
blurRadius: base * 2,
offset: Offset(0, 1),
);
}
final double listCellHeight = 72;
ThemeData _buildDefaultTheme() => ThemeData(
brightness: Brightness.light,
primaryColor: indigo,
errorColor: errorRed,
accentColor: Colors.indigoAccent,
splashColor: splashColor,
cardTheme: CardTheme(
elevation: 1.5,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(ThemeBorder.cardRadiusLarge),
),
),
fontFamily: fontFamily,
inputDecorationTheme: InputDecorationTheme(
filled: true,
fillColor: Color(0xfff8f8f8),
),
textTheme: TextTheme(
display4: TextStyle(
fontSize: 44.0,
color: black,
fontFamily: fontFamily,
letterSpacing: -0.3,
height: baseLineHeight,
fontWeight: FontWeight.w500,
),
display3: TextStyle(
fontSize: 40.0,
color: black,
fontFamily: fontFamily,
letterSpacing: -1,
height: baseLineHeight,
fontWeight: FontWeight.w500,
),
display2: TextStyle(
fontSize: 34.0,
color: black,
height: baseLineHeight,
fontFamily: fontFamily,
fontWeight: FontWeight.w500,
),
display1: TextStyle(
fontSize: 28.0,
color: black,
height: baseLineHeight,
fontFamily: fontFamily,
fontWeight: FontWeight.w500,
),
headline: TextStyle(
fontSize: 20.0,
color: black,
letterSpacing: 0.25,
fontFamily: fontFamily,
height: baseLineHeight,
fontWeight: FontWeight.w500,
),
body1: TextStyle(
fontSize: 16.0,
color: black,
fontFamily: fontFamily,
height: baseLineHeight,
fontWeight: FontWeight.w500,
),
body2: TextStyle(
fontSize: 15.0,
color: black,
fontFamily: fontFamily,
height: baseLineHeight,
fontWeight: FontWeight.w500,
),
caption: TextStyle(
fontSize: 12.0,
color: black,
fontFamily: fontFamily,
height: baseLineHeight,
fontWeight: FontWeight.w500,
),
),
// in `dev` channel
// floatingActionButtonTheme: FloatingActionButtonThemeData(
// elevation: 0,
// highlightElevation: 0,
// disabledElevation: 0,
// ),
appBarTheme: AppBarTheme(
brightness: Brightness.light,
color: Colors.white,
elevation: 0,
iconTheme: IconThemeData(color: Colors.black),
textTheme: TextTheme(
title: TextStyle(
fontSize: 18,
fontWeight: FontWeight.w500,
color: Colors.black,
),
),
),
buttonColor: buttonPrimaryFillColor,
buttonTheme: ButtonThemeData(
buttonColor: buttonPrimaryFillColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(ThemeBorder.buttonRadius),
),
textTheme: ButtonTextTheme.primary,
),
);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment