use color.shadeXxx instead of color[Xxx] (#8932)

* use color.shadeXxx instead of color[Xxx]

* remove calls to .shade500 on MaterialColor

* remove calls to .shade200 on MaterialAccentColor

* fix test

dev/benchmarks/complex_layout/lib/main.dart

@@ -633,7 +633,7 @@ class FancyDrawerHeader extends StatelessWidget {
   Widget build(BuildContext context) {
     return new Container(
       decoration: new BoxDecoration(
-        backgroundColor: Colors.purple[500]
+        backgroundColor: Colors.purple
       ),
       height: 200.0
     );

dev/manual_tests/card_collection.dart

@@ -378,7 +378,7 @@ class CardCollectionState extends State<CardCollection> {
 
     final Widget body = new Container(
       padding: const EdgeInsets.symmetric(vertical: 12.0, horizontal: 8.0),
-      color: _primaryColor[50],
+      color: _primaryColor.shade50,
       child: cardCollection,
     );
 

dev/manual_tests/drag_and_drop.dart

@@ -12,7 +12,7 @@ class ExampleDragTarget extends StatefulWidget {
 }
 
 class ExampleDragTargetState extends State<ExampleDragTarget> {
-  Color _color = Colors.grey[500];
+  Color _color = Colors.grey;
 
   void _handleAccept(Color data) {
     setState(() {
@@ -31,9 +31,9 @@ class ExampleDragTargetState extends State<ExampleDragTarget> {
           decoration: new BoxDecoration(
             border: new Border.all(
               width: 3.0,
-              color: data.isEmpty ? Colors.white : Colors.blue[500]
+              color: data.isEmpty ? Colors.white : Colors.blue
             ),
-            backgroundColor: data.isEmpty ? _color : Colors.grey[200]
+            backgroundColor: data.isEmpty ? _color : Colors.grey.shade200
           )
         );
       }
@@ -190,7 +190,7 @@ class MovableBall extends StatelessWidget {
       textAlign: TextAlign.center,
       child: new Dot(
         key: kBallKey,
-        color: Colors.blue[700],
+        color: Colors.blue.shade700,
         size: kBallSize,
         tappable: true,
         child: new Center(child: new Text('BALL'))
@@ -248,19 +248,19 @@ class DragAndDropAppState extends State<DragAndDropApp> {
               mainAxisAlignment: MainAxisAlignment.spaceAround,
               children: <Widget>[
                 new ExampleDragSource(
-                  color: Colors.yellow[300],
+                  color: Colors.yellow.shade300,
                   under: true,
                   heavy: false,
                   child: new Text('under')
                 ),
                 new ExampleDragSource(
-                  color: Colors.green[300],
+                  color: Colors.green.shade300,
                   under: false,
                   heavy: true,
                   child: new Text('long-press above')
                 ),
                 new ExampleDragSource(
-                  color: Colors.indigo[300],
+                  color: Colors.indigo.shade300,
                   under: false,
                   heavy: false,
                   child: new Text('above')

dev/manual_tests/material_arc.dart

@@ -71,11 +71,11 @@ class _PointDemoPainter extends CustomPainter {
     final Paint paint = new Paint();
 
     if (arc.center != null)
-      drawPoint(canvas, arc.center, Colors.grey[400]);
+      drawPoint(canvas, arc.center, Colors.grey.shade400);
 
     paint
       ..isAntiAlias = false // Work-around for github.com/flutter/flutter/issues/5720
-      ..color = Colors.green[500].withOpacity(0.25)
+      ..color = Colors.green.withOpacity(0.25)
       ..strokeWidth = 4.0
       ..style = PaintingStyle.stroke;
     if (arc.center != null && arc.radius != null)
@@ -83,11 +83,11 @@ class _PointDemoPainter extends CustomPainter {
     else
       canvas.drawLine(arc.begin, arc.end, paint);
 
-    drawPoint(canvas, arc.begin, Colors.green[500]);
-    drawPoint(canvas, arc.end, Colors.red[500]);
+    drawPoint(canvas, arc.begin, Colors.green);
+    drawPoint(canvas, arc.end, Colors.red);
 
     paint
-      ..color = Colors.green[500]
+      ..color = Colors.green
       ..style = PaintingStyle.fill;
     canvas.drawCircle(arc.lerp(_repaint.value), _kPointRadius, paint);
   }
@@ -252,9 +252,9 @@ class _RectangleDemoPainter extends CustomPainter {
 
   @override
   void paint(Canvas canvas, Size size) {
-    drawRect(canvas, arc.begin, Colors.green[500]);
-    drawRect(canvas, arc.end, Colors.red[500]);
-    drawRect(canvas, arc.lerp(_repaint.value), Colors.blue[500]);
+    drawRect(canvas, arc.begin, Colors.green);
+    drawRect(canvas, arc.end, Colors.red);
+    drawRect(canvas, arc.lerp(_repaint.value), Colors.blue);
   }
 
   @override

dev/manual_tests/overlay_geometry.dart

@@ -146,7 +146,7 @@ class OverlayGeometryAppState extends State<OverlayGeometryApp> {
       48.0, 63.0, 82.0, 146.0, 60.0, 55.0, 84.0, 96.0, 50.0,
     ];
     cardModels = new List<CardModel>.generate(cardHeights.length, (int i) {
-      final Color color = Color.lerp(Colors.red[300], Colors.blue[900], i / cardHeights.length);
+      final Color color = Color.lerp(Colors.red.shade300, Colors.blue.shade900, i / cardHeights.length);
       return new CardModel(i, cardHeights[i], color);
     });
   }
@@ -207,7 +207,7 @@ void main() {
     theme: new ThemeData(
       brightness: Brightness.light,
       primarySwatch: Colors.blue,
-      accentColor: Colors.redAccent[200],
+      accentColor: Colors.redAccent,
     ),
     title: 'Cards',
     home: new OverlayGeometryApp(),

dev/manual_tests/page_view.dart

@@ -31,7 +31,7 @@ class PageViewAppState extends State<PageViewApp> {
     ];
 
     cardModels = new List<CardModel>.generate(cardSizes.length, (int i) {
-      final Color color = Color.lerp(Colors.red[300], Colors.blue[900], i / cardSizes.length);
+      final Color color = Color.lerp(Colors.red.shade300, Colors.blue.shade900, i / cardSizes.length);
       return new CardModel(i, cardSizes[i], color);
     });
   }
@@ -148,7 +148,7 @@ void main() {
     theme: new ThemeData(
       brightness: Brightness.light,
       primarySwatch: Colors.blue,
-      accentColor: Colors.redAccent[200],
+      accentColor: Colors.redAccent,
     ),
     home: new PageViewApp(),
   ));

examples/flutter_gallery/lib/demo/animation/widgets.dart

@@ -151,7 +151,7 @@ class SectionDetailView extends StatelessWidget {
     }
 
     return new DecoratedBox(
-      decoration: new BoxDecoration(backgroundColor: Colors.grey[200]),
+      decoration: new BoxDecoration(backgroundColor: Colors.grey.shade200),
       child: item,
     );
   }

examples/flutter_gallery/lib/demo/material/bottom_navigation_demo.dart

@@ -98,31 +98,31 @@ class _BottomNavigationDemoState extends State<BottomNavigationDemo>
       new NavigationIconView(
         icon: new Icon(Icons.access_alarm),
         title: new Text('Alarm'),
-        color: Colors.deepPurple[500],
+        color: Colors.deepPurple,
         vsync: this,
       ),
       new NavigationIconView(
         icon: new CustomIcon(),
         title: new Text('Box'),
-        color: Colors.deepOrange[500],
+        color: Colors.deepOrange,
         vsync: this,
       ),
       new NavigationIconView(
         icon: new Icon(Icons.cloud),
         title: new Text('Cloud'),
-        color: Colors.teal[500],
+        color: Colors.teal,
         vsync: this,
       ),
       new NavigationIconView(
         icon: new Icon(Icons.favorite),
         title: new Text('Favorites'),
-        color: Colors.indigo[500],
+        color: Colors.indigo,
         vsync: this,
       ),
       new NavigationIconView(
         icon: new Icon(Icons.event_available),
         title: new Text('Event'),
-        color: Colors.pink[500],
+        color: Colors.pink,
         vsync: this,
       )
     ];

examples/flutter_gallery/lib/demo/material/date_and_time_picker_demo.dart

@@ -35,7 +35,7 @@ class _InputDropdown extends StatelessWidget {
           children: <Widget>[
             new Text(valueText, style: valueStyle),
             new Icon(Icons.arrow_drop_down,
-              color: Theme.of(context).brightness == Brightness.light ? Colors.grey[700] : Colors.white70
+              color: Theme.of(context).brightness == Brightness.light ? Colors.grey.shade700 : Colors.white70
             ),
           ],
         ),

examples/flutter_gallery/lib/demo/material/persistent_bottom_sheet_demo.dart

@@ -75,7 +75,7 @@ class _PersistentBottomSheetDemoState extends State<PersistentBottomSheetDemo> {
       appBar: new AppBar(title: new Text('Persistent bottom sheet')),
       floatingActionButton: new FloatingActionButton(
         onPressed: _showMessage,
-        backgroundColor: Colors.redAccent[200],
+        backgroundColor: Colors.redAccent,
         child: new Icon(Icons.add)
       ),
       body: new Center(

examples/flutter_gallery/lib/demo/material/tabs_fab_demo.dart

@@ -17,9 +17,9 @@ class _Page {
   final MaterialColor colors;
   final IconData icon;
 
-  Color get labelColor => colors != null ? colors[300] : Colors.grey[300];
+  Color get labelColor => colors != null ? colors.shade300 : Colors.grey.shade300;
   bool get fabDefined => colors != null && icon != null;
-  Color get fabColor => colors[400];
+  Color get fabColor => colors.shade400;
   Icon get fabIcon => new Icon(icon);
   Key get fabKey => new ValueKey<Color>(fabColor);
 }

examples/flutter_gallery/lib/demo/pesto_demo.dart

@@ -25,7 +25,7 @@ final Set<Recipe> _favoriteRecipes = new Set<Recipe>();
 final ThemeData _kTheme = new ThemeData(
   brightness: Brightness.light,
   primarySwatch: Colors.teal,
-  accentColor: Colors.redAccent[200],
+  accentColor: Colors.redAccent,
 );
 
 class PestoHome extends StatelessWidget {

examples/flutter_gallery/lib/gallery/app.dart

@@ -127,7 +127,7 @@ class GalleryAppState extends State<GalleryApp> {
 
     return new MaterialApp(
       title: 'Flutter Gallery',
-      color: Colors.grey[500],
+      color: Colors.grey,
       theme: (_useLightTheme ? _kGalleryLightTheme : _kGalleryDarkTheme).copyWith(platform: _platform ?? defaultTargetPlatform),
       showPerformanceOverlay: _showPerformanceOverlay,
       checkerboardRasterCacheImages: _checkerboardRasterCacheImages,

examples/layers/rendering/touch_input.dart

@@ -10,12 +10,12 @@ import 'package:flutter/rendering.dart';
 
 // Material design colors. :p
 List<Color> _kColors = <Color>[
-  Colors.teal[500],
-  Colors.amber[500],
-  Colors.purple[500],
-  Colors.lightBlue[500],
-  Colors.deepPurple[500],
-  Colors.lime[500],
+  Colors.teal,
+  Colors.amber,
+  Colors.purple,
+  Colors.lightBlue,
+  Colors.deepPurple,
+  Colors.lime,
 ];
 
 /// A simple model object for a dot that reacts to pointer pressure.

examples/layers/widgets/gestures.dart

@@ -30,8 +30,8 @@ class _GesturePainter extends CustomPainter {
     final Point center = (size.center(Point.origin).toOffset() * zoom + offset).toPoint();
     final double radius = size.width / 2.0 * zoom;
     final Gradient gradient = new RadialGradient(
-      colors: forward ? <Color>[swatch[50], swatch[900]]
-                      : <Color>[swatch[900], swatch[50]]
+      colors: forward ? <Color>[swatch.shade50, swatch.shade900]
+                      : <Color>[swatch.shade900, swatch.shade50]
     );
     final Paint paint = new Paint()
       ..shader = gradient.createShader(new Rect.fromLTWH(

examples/layers/widgets/media_query.dart

@@ -18,7 +18,7 @@ class AdaptedListItem extends StatelessWidget {
           height: 32.0,
           margin: const EdgeInsets.all(8.0),
           decoration: new BoxDecoration(
-            backgroundColor: Colors.lightBlueAccent[100]
+            backgroundColor: Colors.lightBlueAccent.shade100
           )
         ),
         new Text(name)
@@ -40,7 +40,7 @@ class AdaptedGridItem extends StatelessWidget {
           new Expanded(
             child: new Container(
               decoration: new BoxDecoration(
-                backgroundColor: Colors.lightBlueAccent[100]
+                backgroundColor: Colors.lightBlueAccent.shade100
               )
             )
           ),

examples/layers/widgets/styled_text.dart

@@ -23,8 +23,8 @@ final List<List<String>> _kNameLines = _kDialogText
   .map((String line) => line.split(':'))
   .toList();
 
-final TextStyle _kDaveStyle = new TextStyle(color: Colors.indigo[400], height: 1.8);
-final TextStyle _kHalStyle = new TextStyle(color: Colors.red[400], fontFamily: "monospace");
+final TextStyle _kDaveStyle = new TextStyle(color: Colors.indigo.shade400, height: 1.8);
+final TextStyle _kHalStyle = new TextStyle(color: Colors.red.shade400, fontFamily: "monospace");
 final TextStyle _kBold = const TextStyle(fontWeight: FontWeight.bold);
 final TextStyle _kUnderline = const TextStyle(
   decoration: TextDecoration.underline,
@@ -127,7 +127,7 @@ void main() {
         title: new Text('Hal and Dave')
       ),
       body: new Material(
-        color: Colors.grey[50],
+        color: Colors.grey.shade50,
         child: new StyledTextDemo()
       )
     )

examples/stocks/lib/main.dart

@@ -72,7 +72,7 @@ class StocksAppState extends State<StocksApp> {
       case StockMode.pessimistic:
         return new ThemeData(
           brightness: Brightness.dark,
-          accentColor: Colors.redAccent[200]
+          accentColor: Colors.redAccent
         );
     }
     assert(_configuration.stockMode != null);

examples/stocks/lib/stock_home.dart

@@ -312,7 +312,7 @@ class StockHomeState extends State<StockHome> {
     return new FloatingActionButton(
       tooltip: 'Create company',
       child: new Icon(Icons.add),
-      backgroundColor: Colors.redAccent[200],
+      backgroundColor: Colors.redAccent,
       onPressed: _handleCreateCompany
     );
   }

examples/stocks/test/icon_color_test.dart

@@ -76,7 +76,7 @@ void main() {
     expect(find.text('Account Balance'), findsOneWidget);
 
     // check the colour of the icon - light mode
-    checkIconColor(tester, 'Stock List', Colors.purple[500]); // theme primary color
+    checkIconColor(tester, 'Stock List', Colors.purple.shade500); // theme primary color
     checkIconColor(tester, 'Account Balance', Colors.black26); // disabled
     checkIconColor(tester, 'About', Colors.black45); // enabled
 
@@ -87,7 +87,7 @@ void main() {
     await tester.pump(const Duration(seconds: 5)); // end the transition
 
     // check the colour of the icon - dark mode
-    checkIconColor(tester, 'Stock List', Colors.redAccent[200]); // theme accent color
+    checkIconColor(tester, 'Stock List', Colors.redAccent); // theme accent color
     checkIconColor(tester, 'Account Balance', Colors.white30); // disabled
     checkIconColor(tester, 'About', Colors.white); // enabled
   });

packages/flutter/lib/src/material/app.dart

@@ -217,8 +217,8 @@ class _MaterialAppState extends State<MaterialApp> {
         key: new GlobalObjectKey(this),
         title: config.title,
         textStyle: _errorTextStyle,
-        // blue[500] is the primary color of the default theme
-        color: config.color ?? theme?.primaryColor ?? Colors.blue[500],
+        // blue is the primary color of the default theme
+        color: config.color ?? theme?.primaryColor ?? Colors.blue,
         navigatorObservers:
             new List<NavigatorObserver>.from(config.navigatorObservers)
               ..add(_heroController),

packages/flutter/lib/src/material/chip.dart

@@ -112,7 +112,7 @@ class Chip extends StatelessWidget {
         height: _kChipHeight,
         padding: new EdgeInsets.only(left: leftPadding, right: rightPadding),
         decoration: new BoxDecoration(
-          backgroundColor: Colors.grey[300],
+          backgroundColor: Colors.grey.shade300,
           borderRadius: new BorderRadius.circular(16.0)
         ),
         child: new Row(

packages/flutter/lib/src/material/circle_avatar.dart

@@ -30,7 +30,7 @@ import 'theme.dart';
 ///
 /// ```dart
 /// new CircleAvatar(
-///   backgroundColor: Colors.brown[800],
+///   backgroundColor: Colors.brown.shade800,
 ///   child: new Text('AH'),
 /// );
 /// ```

packages/flutter/lib/src/material/divider.dart

@@ -52,7 +52,7 @@ class Divider extends StatelessWidget {
   ///
   /// ```dart
   ///  new Divider(
-  ///    color: Colors.deepOrange[500],
+  ///    color: Colors.deepOrange,
   ///  ),
   /// ```
   final Color color;

packages/flutter/lib/src/material/dropdown.dart

@@ -559,7 +559,7 @@ class _DropdownButtonState<T> extends State<DropdownButton<T>> {
             new Icon(Icons.arrow_drop_down,
               size: config.iconSize,
               // These colors are not defined in the Material Design spec.
-              color: Theme.of(context).brightness == Brightness.light ? Colors.grey[700] : Colors.white70
+              color: Theme.of(context).brightness == Brightness.light ? Colors.grey.shade700 : Colors.white70
             ),
           ],
         ),

packages/flutter/lib/src/material/flat_button.dart

@@ -83,7 +83,7 @@ class FlatButton extends StatelessWidget {
   ///
   /// ```dart
   ///  new FlatButton(
-  ///    color: Colors.blue[500],
+  ///    color: Colors.blue,
   ///    onPressed: _handleTap,
   ///    child: new Text('DEMO'),
   ///  ),

packages/flutter/lib/src/material/icon.dart

@@ -83,7 +83,7 @@ class Icon extends StatelessWidget {
   /// ```dart
   ///  new Icon(
   ///    icon: Icons.widgets,
-  ///    color: Colors.blue[400],
+  ///    color: Colors.blue.shade400,
   ///  ),
   /// ```
   final Color color;

packages/flutter/lib/src/material/icon_button.dart

@@ -107,7 +107,7 @@ class IconButton extends StatelessWidget {
   ///
   /// ```dart
   ///  new IconButton(
-  ///    color: Colors.blue[500],
+  ///    color: Colors.blue,
   ///    onPressed: _handleTap,
   ///    icon: Icons.widgets,
   ///  ),

packages/flutter/lib/src/material/raised_button.dart

@@ -58,7 +58,7 @@ class RaisedButton extends StatelessWidget {
   ///
   /// ```dart
   ///  new RaisedButton(
-  ///    color: Colors.blue[500],
+  ///    color: Colors.blue,
   ///    onPressed: _handleTap,
   ///    child: new Text('DEMO'),
   ///  ),

packages/flutter/lib/src/material/slider.dart

@@ -232,8 +232,8 @@ const double _kActiveThumbRadius = 9.0;
 const double _kDisabledThumbRadius = 4.0;
 const double _kReactionRadius = 16.0;
 const double _kTrackWidth = 144.0;
-final Color _kInactiveTrackColor = Colors.grey[400];
-final Color _kActiveTrackColor = Colors.grey[500];
+final Color _kInactiveTrackColor = Colors.grey.shade400;
+final Color _kActiveTrackColor = Colors.grey;
 final Tween<double> _kReactionRadiusTween = new Tween<double>(begin: _kThumbRadius, end: _kReactionRadius);
 final Tween<double> _kThumbRadiusTween = new Tween<double>(begin: _kThumbRadius, end: _kActiveThumbRadius);
 final ColorTween _kTrackColorTween = new ColorTween(begin: _kInactiveTrackColor, end: _kActiveTrackColor);

packages/flutter/lib/src/material/stepper.dart

@@ -53,8 +53,8 @@ const TextStyle _kStepStyle = const TextStyle(
   fontSize: 12.0,
   color: Colors.white,
 );
-final Color _kErrorLight = Colors.red[500];
-final Color _kErrorDark = Colors.red[400];
+final Color _kErrorLight = Colors.red;
+final Color _kErrorDark = Colors.red.shade400;
 const Color _kCircleActiveLight = Colors.white;
 const Color _kCircleActiveDark = Colors.black87;
 const Color _kDisabledLight = Colors.black38;
@@ -222,7 +222,7 @@ class _StepperState extends State<Stepper> with TickerProviderStateMixin {
       width: visible ? 1.0 : 0.0,
       height: 16.0,
       decoration: new BoxDecoration(
-        backgroundColor: Colors.grey[400],
+        backgroundColor: Colors.grey.shade400,
       ),
     );
   }
@@ -481,7 +481,7 @@ class _StepperState extends State<Stepper> with TickerProviderStateMixin {
                 width: _isLast(index) ? 0.0 : 1.0,
                 child: new Container(
                   decoration: new BoxDecoration(
-                    backgroundColor: Colors.grey[400],
+                    backgroundColor: Colors.grey.shade400,
                   ),
                 ),
               ),
@@ -582,7 +582,7 @@ class _StepperState extends State<Stepper> with TickerProviderStateMixin {
               margin: const EdgeInsets.symmetric(horizontal: 8.0),
               height: 1.0,
               decoration: new BoxDecoration(
-                backgroundColor: Colors.grey[400],
+                backgroundColor: Colors.grey.shade400,
               ),
             ),
           ),

packages/flutter/lib/src/material/switch.dart

@@ -114,10 +114,10 @@ class _SwitchState extends State<Switch> with TickerProviderStateMixin {
     Color inactiveThumbColor;
     Color inactiveTrackColor;
     if (config.onChanged != null) {
-      inactiveThumbColor = isDark ? Colors.grey[400] : Colors.grey[50];
+      inactiveThumbColor = isDark ? Colors.grey.shade400 : Colors.grey.shade50;
       inactiveTrackColor = isDark ? Colors.white30 : Colors.black26;
     } else {
-      inactiveThumbColor = isDark ? Colors.grey[800] : Colors.grey[400];
+      inactiveThumbColor = isDark ? Colors.grey.shade800 : Colors.grey.shade400;
       inactiveTrackColor = isDark ? Colors.white10 : Colors.black12;
     }
 

packages/flutter_markdown/lib/src/markdown_style.dart

@@ -12,10 +12,10 @@ class MarkdownStyle extends MarkdownStyleRaw{
 
   /// Creates a [MarkdownStyle] from the [TextStyle]s in the provided [theme].
   MarkdownStyle.defaultFromTheme(ThemeData theme) : super(
-    a: new TextStyle(color: Colors.blue[500]),
+    a: new TextStyle(color: Colors.blue),
     p: theme.textTheme.body1,
     code: new TextStyle(
-      color: Colors.grey[700],
+      color: Colors.grey.shade700,
       fontFamily: "monospace",
       fontSize: theme.textTheme.body1.fontSize * 0.85
     ),
@@ -32,12 +32,12 @@ class MarkdownStyle extends MarkdownStyleRaw{
     listIndent: 32.0,
     blockquotePadding: 8.0,
     blockquoteDecoration: new BoxDecoration(
-      backgroundColor: Colors.blue[100],
+      backgroundColor: Colors.blue.shade100,
       borderRadius: new BorderRadius.circular(2.0)
     ),
     codeblockPadding: 8.0,
     codeblockDecoration: new BoxDecoration(
-      backgroundColor: Colors.grey[100],
+      backgroundColor: Colors.grey.shade100,
       borderRadius: new BorderRadius.circular(2.0)
     )
   );
@@ -46,10 +46,10 @@ class MarkdownStyle extends MarkdownStyleRaw{
   /// This style uses larger fonts for the headings than in
   /// [MarkdownStyle.defaultFromTheme].
   MarkdownStyle.largeFromTheme(ThemeData theme) : super (
-    a: new TextStyle(color: Colors.blue[500]),
+    a: new TextStyle(color: Colors.blue),
     p: theme.textTheme.body1,
     code: new TextStyle(
-      color: Colors.grey[700],
+      color: Colors.grey.shade700,
       fontFamily: "monospace",
       fontSize: theme.textTheme.body1.fontSize * 0.85
     ),
@@ -66,12 +66,12 @@ class MarkdownStyle extends MarkdownStyleRaw{
     listIndent: 32.0,
     blockquotePadding: 8.0,
     blockquoteDecoration: new BoxDecoration(
-      backgroundColor: Colors.blue[100],
+      backgroundColor: Colors.blue.shade100,
       borderRadius: new BorderRadius.circular(2.0)
     ),
     codeblockPadding: 8.0,
     codeblockDecoration: new BoxDecoration(
-      backgroundColor: Colors.grey[100],
+      backgroundColor: Colors.grey.shade100,
       borderRadius: new BorderRadius.circular(2.0)
     )
   );