diff --git a/framework/components/action_bar.dart b/framework/components/action_bar.dart
index 2abdc0d01e5..cf8bc6ff208 100644
--- a/framework/components/action_bar.dart
+++ b/framework/components/action_bar.dart
@@ -3,8 +3,8 @@
 // found in the LICENSE file.
 
 import '../fn.dart';
-import '../theme/shadows.dart';
 import '../theme/view-configuration.dart';
+import 'material.dart';
 
 class ActionBar extends Component {
   static final Style _style = new Style('''
@@ -13,8 +13,7 @@ class ActionBar extends Component {
     height: 56px;
     padding: 0 8px;
     transition: background-color 0.3s;
-    padding-top: ${kStatusBarHeight}px;
-    box-shadow: ${Shadow[2]};''');
+    padding-top: ${kStatusBarHeight}px;''');
 
   static Style _centerStyle = new Style('''
     padding-left: 24px;
@@ -37,6 +36,8 @@ class ActionBar extends Component {
     if (right != null)
       children.addAll(right);
 
-    return new Container(style: _style, children: children);
+    return new Material(
+      content: new Container(style: _style, children: children),
+      level: 2);
   }
 }
diff --git a/framework/components/button.dart b/framework/components/button.dart
index bcaa0ad4867..589253ab3d9 100644
--- a/framework/components/button.dart
+++ b/framework/components/button.dart
@@ -26,7 +26,9 @@ class Button extends Component {
 
   Node build() {
     return new StyleNode(
-      new Material(children: [content], level: level),
+      new Material(
+        content: new InkWell(children: [content]),
+        level: level),
       _style);
   }
 }
diff --git a/framework/components/drawer.dart b/framework/components/drawer.dart
index 2c3cb3aabc0..29e94ca48a7 100644
--- a/framework/components/drawer.dart
+++ b/framework/components/drawer.dart
@@ -126,7 +126,6 @@ class Drawer extends AnimatedComponent {
 
     var mask = new EventTarget(
       new Container(
-        key: 'Mask',
         style: _maskStyle,
         inlineStyle: maskInlineStyle
       ),
@@ -134,13 +133,13 @@ class Drawer extends AnimatedComponent {
       onGestureFlingStart: controller.handleFlingStart
     );
 
-    Node content = new StyleNode(
-      new Material(
-        key: 'Content',
+    Material content = new Material(
+      content: new Container(
+        style: _contentStyle,
         inlineStyle: contentInlineStyle,
-        children: children,
-        level: level),
-      _contentStyle);
+        children: children
+      ),
+      level: level);
 
     return new EventTarget(
       new Container(
diff --git a/framework/components/floating_action_button.dart b/framework/components/floating_action_button.dart
index 0fe36f3e466..3d548d3ba84 100644
--- a/framework/components/floating_action_button.dart
+++ b/framework/components/floating_action_button.dart
@@ -41,9 +41,10 @@ class FloatingActionButton extends Component {
     if (content != null)
       children.add(content);
 
-    return new Container(
-      style: level > 0 ? _style.extend(Material.shadowStyle[level]) : _style,
-      children: [new StyleNode(new InkWell(children: children), _clipStyle)]
-    );
+    return new Material(
+      content: new Container(
+        style: _style,
+        children: [new StyleNode(new InkWell(children: children), _clipStyle)]),
+      level: level);
   }
 }
diff --git a/framework/components/material.dart b/framework/components/material.dart
index 38eeb583579..88ba6e30be4 100644
--- a/framework/components/material.dart
+++ b/framework/components/material.dart
@@ -7,7 +7,7 @@ import '../theme/shadows.dart';
 import 'ink_well.dart';
 
 class Material extends Component {
-  static final List<Style> shadowStyle = [
+  static final List<Style> _shadowStyle = [
     null,
     new Style('box-shadow: ${Shadow[1]}'),
     new Style('box-shadow: ${Shadow[2]}'),
@@ -16,20 +16,12 @@ class Material extends Component {
     new Style('box-shadow: ${Shadow[5]}'),
   ];
 
-  String inlineStyle;
-  List<Node> children;
+  Node content;
   int level;
 
-  Material({
-    Object key,
-    this.inlineStyle,
-    this.children,
-    this.level: 0
-  }) : super(key: key);
+  Material({ Object key, this.content, this.level: 0 }) : super(key: key);
 
   Node build() {
-    return new StyleNode(
-      new InkWell(inlineStyle: inlineStyle, children: children),
-      shadowStyle[level]);
+    return new StyleNode(content, _shadowStyle[level]);
   }
 }
diff --git a/framework/components/popup_menu.dart b/framework/components/popup_menu.dart
index d5a2e89939d..9b42bc50a68 100644
--- a/framework/components/popup_menu.dart
+++ b/framework/components/popup_menu.dart
@@ -14,7 +14,8 @@ import 'material.dart';
 import 'popup_menu_item.dart';
 
 const double _kMenuOpenDuration = 300.0;
-const double _kMenuCloneDuration = 200.0;
+const double _kMenuCloseDuration = 200.0;
+const double _kMenuCloseDelay = 100.0;
 
 class PopupMenuController {
   bool isOpen = false;
@@ -26,7 +27,8 @@ class PopupMenuController {
   }
 
   Future close() {
-    return position.animateTo(0.0, _kMenuCloneDuration).then((_) {
+    return position.animateTo(0.0, _kMenuCloseDuration,
+        initialDelay: _kMenuCloseDelay).then((_) {
       isOpen = false;
     });
   }
@@ -87,11 +89,12 @@ class PopupMenu extends AnimatedComponent {
       return new PopupMenuItem(key: i++, children: item, opacity: opacity);
     }));
 
-    return new StyleNode(
-      new Material(
+    return new Material(
+      content: new Container(
+        style: _style,
         inlineStyle: _inlineStyle(),
-        children: children,
-        level: level),
-      _style);
+        children: children
+      ),
+      level: level);
   }
 }