diff --git a/ionic/components/action-menu/action-menu.ts b/ionic/components/action-menu/action-menu.ts index fe669bbd93..1eb0649f7b 100644 --- a/ionic/components/action-menu/action-menu.ts +++ b/ionic/components/action-menu/action-menu.ts @@ -6,7 +6,7 @@ * The ActionMenu is a modal menu with options to select based on an action. */ -import {View, Injectable, NgFor, NgIf} from 'angular2/angular2'; +import {View, Injectable, NgFor, NgIf, CSSClass} from 'angular2/angular2'; import {TapClick} from '../button/button'; import {Overlay} from '../overlay/overlay'; @@ -21,7 +21,7 @@ import * as util from 'ionic/util';
`, - directives: [NgFor, NgIf, TapClick] + directives: [NgFor, NgIf, CSSClass, TapClick] }) class ActionMenuDirective { diff --git a/ionic/components/action-menu/extensions/material.scss b/ionic/components/action-menu/extensions/material.scss index 58393e87de..2491955879 100644 --- a/ionic/components/action-menu/extensions/material.scss +++ b/ionic/components/action-menu/extensions/material.scss @@ -1,32 +1,38 @@ + .action-menu[mode="md"] { + margin: 0; .action-menu-backdrop.active { background-color: rgba(0,0,0,0.2); } - .action-menu { + + .action-menu-container { margin: 0; + } - .action-menu-title, - button, - [button] { - text-align: left; - border-color: transparent; - font-size: 16px; - color: inherit; - } + .action-menu-title, + .action-menu-option { + text-align: left; + border-color: transparent; + font-size: 16px; + color: inherit; + } - .action-menu-title { - font-size: 14px; - padding: 16px; - color: #666; - } + .action-menu-title { + font-size: 14px; + padding: 16px; + color: #666; + } - button.activated, - [button].activated { - background: #e8e8e8; - } + .action-menu-option .icon { + font-size: 24px; + margin: 0 32px; + } + + .action-menu-option.activated { + background: #e8e8e8; } .action-menu-group { @@ -47,5 +53,4 @@ } } - } diff --git a/ionic/components/app/test/material/index.ts b/ionic/components/app/test/material/index.ts index cc7ce94f4b..ad625622f8 100644 --- a/ionic/components/app/test/material/index.ts +++ b/ionic/components/app/test/material/index.ts @@ -1,6 +1,6 @@ import {Component, Directive} from 'angular2/angular2'; -import {App, IonicApp, IonicView, Register} from 'ionic/ionic'; +import {App, ActionMenu, IonicApp, IonicView, Register} from 'ionic/ionic'; @IonicView({ template: '