Add an implict animation between ActionBar backgrounds

sky/framework/components/input.dart

 // Copyright 2015 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 import '../editing/editable_string.dart';
 import '../editing/editable_text.dart';
 import '../editing/keyboard.dart';
 import '../fn.dart';
 import '../theme/colors.dart';
+import '../theme/typography.dart' as typography;
 
 typedef void ValueChanged(value);
 
 class Input extends Component {
   static final Style _style = new Style('''
     display: paragraph;
     transform: translateX(0);
     margin: 8px;
     padding: 8px;
     border-bottom: 1px solid ${Grey[200]};
     align-self: center;
     height: 1.2em;
     white-space: pre;
     overflow: hidden;'''
   );
 
   static final Style _placeholderStyle = new Style('''
     top: 8px;
     left: 8px;
-    color: ${Grey[200]};
-    position: absolute;'''
+    position: absolute;
+    ${typography.black.caption};'''
   );
 
   static final String _focusedInlineStyle = '''
     padding: 7px;
     border-bottom: 2px solid ${Blue[500]};''';
 
   ValueChanged onChanged;
   String placeholder;
   bool focused = false;
 
@@ skipping 40 matching lines @@
 
     children.add(new EditableText(value: _editableValue, focused: focused));
 
     return new Container(
       style: _style,
       inlineStyle: focused ? _focusedInlineStyle : null,
       children: children
     );
   }
 }