javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-19 19:57:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

Menu Materials

Browse Source
This commit is contained in:
Max Lynch
2015-07-19 11:38:08 -05:00
parent c6009dd651
commit fc93ae5fe7
2 changed files with 28 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
ionic/components/action-menu/action-menu.ts
View File

@ -22,10 +22,10 @@ import * as util from 'ionic/util';
<div class="action-menu-group action-menu-options">
<div class="action-menu-title" *ng-if="titleText">{{titleText}}</div>
<button (^click)="_buttonClicked(index)" *ng-for="#b of buttons; #index = index" class="action-menu-option"><i class="icon" [class]="b.icon" *ng-if="b.icon"></i> {{b.text}}</button>
<button *ng-if="destructiveText" (click)="_destructive()" class="destructive action-menu-destructive">{{destructiveText}}</button>
<button *ng-if="destructiveText" (click)="_destructive()" class="destructive action-menu-destructive"><i class="icon" [class]="destructiveIcon" *ng-if="destructiveIcon"></i> {{destructiveText}}</button>
</div>
<div class="action-menu-group action-menu-cancel" *ng-if="cancelText">
<button (click)="_cancel()">{{cancelText}}</button>
<button (click)="_cancel()"><i class="icon" [class]="cancelIcon"></i> {{cancelText}}</button>
</div>
</div>
</div>`,
@ -65,10 +65,17 @@ export class ActionMenu extends Overlay {
open(opts={}) {
let defaults = {
enterAnimation: 'action-menu-slide-in',
leaveAnimation: 'action-menu-slide-out'
leaveAnimation: 'action-menu-slide-out',
};
return this.create(OVERLAY_TYPE, ActionMenuDirective, util.extend(defaults, opts), opts);
let contextDefaults = {
cancelIcon: 'ion-close',
destructiveIcon: 'ion-trash-a'
}
let context = util.extend(contextDefaults, opts);
return this.create(OVERLAY_TYPE, ActionMenuDirective, util.extend(defaults, opts), context);
}
get() {

23
ionic/components/action-menu/extensions/material.scss
View File

@ -13,11 +13,19 @@
}
.action-menu-title,
.action-menu-option {
.action-menu-option,
.action-menu-destructive,
.action-menu-cancel button
{
text-align: left;
border-color: transparent;
font-size: 16px;
color: inherit;
.icon {
font-size: 24px;
margin: 0 32px;
}
}
.action-menu-title {
@ -26,10 +34,6 @@
color: #666;
}
.action-menu-option .icon {
font-size: 24px;
margin: 0 32px;
}
.action-menu-option.activated {
background: #e8e8e8;
@ -42,7 +46,14 @@
}
.action-menu-cancel {
display: none;
background-color: #fafafa;
width: auto;
border: none;
font-size: 16px;
color: inherit;
button {
font-weight: normal;
}
}
.action-menu-has-icons {