action menu

src/components/action-menu/action-menu.scss

@@ -1,3 +1,35 @@
 
 // Action Menu
 // --------------------------------------------------
+
+$action-menu-group-margin:               15px !default;
+$action-menu-background-color:           rgba(243,243,243,.95) !default;
+$action-menu-button-text-color:          #007aff !default;
+
+
+.action-menu-container {
+  position: absolute;
+  z-index: $z-index-action-menu;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+}
+
+.action-menu-group {
+  margin: $action-menu-group-margin;
+}
+
+.action-menu-group .action-menu-label {
+  display: block;
+  width: 100%;
+  text-align: center;
+  background: $action-menu-background-color;
+}
+
+.action-menu-group .action-menu-button {
+  display: block;
+  width: 100%;
+  text-align: center;
+  background: $action-menu-background-color;
+  color: $action-menu-button-text-color;
+}

src/components/action-menu/test/basic/main.html

@@ -1,12 +1,24 @@
 
-<div class="pane pane-overlay modal">
+<div class="pane pane-overlay action-menu">
 
   <div class="pane-backdrop"></div>
 
-  <div class="pane-container modal-container">
+  <div class="action-menu-container">
 
-    <div class="content modal-content">
-      <div>Do you like cookies?</div>
+    <div class="action-menu-group">
+      <div class="action-menu-label">Action Menu Label</div>
+      <div class="action-menu-button">Button 1</div>
+      <div class="action-menu-button">Button 2</div>
+    </div>
+
+    <div class="action-menu-group">
+      <div class="action-menu-label">Action Menu Label</div>
+      <div class="action-menu-button">Button 1</div>
+      <div class="action-menu-button">Button 2</div>
+    </div>
+
+    <div class="action-menu-group">
+      <div class="action-menu-button">Button 1</div>
     </div>
 
   </div>

src/components/app/_z-index.scss

@@ -3,6 +3,7 @@
 // --------------------------------------------------
 
 
-$z-index-alert:             100;
-$z-index-content:           1;
-$z-index-list-border:       50;
+$z-index-action-menu:          110;
+$z-index-alert:                100;
+$z-index-content:              1;
+$z-index-list-border:          50;

src/components/app/ionic.scss

@@ -22,6 +22,7 @@
 
 // Default Components
 @import
+  "../action-menu/action-menu",
   "../alert/alert",
   "../aside/aside",
   "../button/button",