refactor(action-sheet): adding a class to icons to style with

references #689
This commit is contained in:
Brandy Carney
2015-12-04 12:54:36 -05:00
parent a965277ef3
commit 9b1e0dc291
2 changed files with 12 additions and 15 deletions

View File

@ -23,17 +23,17 @@ import {extend} from '../../util/util';
'<div class="action-sheet-group action-sheet-options">' + '<div class="action-sheet-group action-sheet-options">' +
'<div class="action-sheet-title" *ng-if="d.titleText">{{d.titleText}}</div>' + '<div class="action-sheet-title" *ng-if="d.titleText">{{d.titleText}}</div>' +
'<button (click)="buttonClicked(i)" *ng-for="#b of d.buttons; #i=index" class="action-sheet-button action-sheet-option disable-hover">' + '<button (click)="buttonClicked(i)" *ng-for="#b of d.buttons; #i=index" class="action-sheet-button action-sheet-option disable-hover">' +
'<icon [name]="b.icon" *ng-if="b.icon"></icon> ' + '<icon [name]="b.icon" *ng-if="b.icon" class="action-sheet-icon"></icon> ' +
'{{b.text}}' + '{{b.text}}' +
'</button>' + '</button>' +
'<button *ng-if="d.destructiveText" (click)="destructive()" class="action-sheet-button action-sheet-destructive disable-hover">' + '<button *ng-if="d.destructiveText" (click)="destructive()" class="action-sheet-button action-sheet-destructive disable-hover">' +
'<icon [name]="d.destructiveIcon" *ng-if="d.destructiveIcon"></icon> ' + '<icon [name]="d.destructiveIcon" *ng-if="d.destructiveIcon" class="action-sheet-icon"></icon> ' +
'{{d.destructiveText}}' + '{{d.destructiveText}}' +
'</button>' + '</button>' +
'</div>' + '</div>' +
'<div class="action-sheet-group" *ng-if="d.cancelText">' + '<div class="action-sheet-group" *ng-if="d.cancelText">' +
'<button (click)="cancel()" class="action-sheet-button action-sheet-cancel disable-hover">' + '<button (click)="cancel()" class="action-sheet-button action-sheet-cancel disable-hover">' +
'<icon [name]="d.cancelIcon" *ng-if="d.cancelIcon"></icon> ' + '<icon [name]="d.cancelIcon" *ng-if="d.cancelIcon" class="action-sheet-icon"></icon> ' +
'{{d.cancelText}}' + '{{d.cancelText}}' +
'</button>' + '</button>' +
'</div>' + '</div>' +

View File

@ -19,18 +19,6 @@ $action-sheet-md-icon-font-size: 2.4rem !default;
$action-sheet-md-icon-margin: 0 28px 0 0 !default; $action-sheet-md-icon-margin: 0 28px 0 0 !default;
ion-action-sheet {
icon {
display: inline-block;
margin: $action-sheet-md-icon-margin;
min-width: 24px;
text-align: center;
vertical-align: middle;
font-size: $action-sheet-md-icon-font-size;
}
}
.action-sheet-title { .action-sheet-title {
padding: $action-sheet-md-title-padding; padding: $action-sheet-md-title-padding;
font-size: $action-sheet-md-title-font-size; font-size: $action-sheet-md-title-font-size;
@ -52,6 +40,15 @@ ion-action-sheet {
} }
} }
.action-sheet-icon {
display: inline-block;
margin: $action-sheet-md-icon-margin;
min-width: 24px;
text-align: center;
vertical-align: middle;
font-size: $action-sheet-md-icon-font-size;
}
.action-sheet-group { .action-sheet-group {
margin: 0; margin: 0;
border-radius: 0; border-radius: 0;