fix(item): add a default size for items in buttons to use the content button sizes

fixes #5580
This commit is contained in:
Brandy Carney
2016-03-04 16:16:22 -05:00
parent f6af807688
commit 7b14a29ea7
3 changed files with 12 additions and 10 deletions

View File

@@ -41,7 +41,7 @@ import {Toolbar} from '../toolbar/toolbar';
})
export class Button {
private _role: string = 'button'; // bar-button/item-button
private _size: string = null; // large/small
private _size: string = null; // large/small/default
private _style: string = 'default'; // outline/clear/solid
private _shape: string = null; // round/fab
private _display: string = null; // block/full
@@ -242,7 +242,7 @@ export class Button {
}
const BUTTON_SIZE_ATTRS = ['large', 'small'];
const BUTTON_SIZE_ATTRS = ['large', 'small', 'default'];
const BUTTON_STYLE_ATTRS = ['clear', 'outline', 'solid'];
const BUTTON_SHAPE_ATTRS = ['round', 'fab'];
const BUTTON_DISPLAY_ATTRS = ['block', 'full'];

View File

@@ -143,7 +143,9 @@ export class Item {
@ContentChildren(Button)
private set _buttons(buttons) {
buttons.toArray().forEach(button => {
if (!button.isItem) {
// Don't add the item-button class if the user specifies
// a different size button
if (!button.isItem && !button._size) {
button.addClass('item-button');
}
});

View File

@@ -49,29 +49,29 @@
</ion-item>
<ion-item>
<button clear item-left (click)="testClick($event)">
<button clear item-left default (click)="testClick($event)">
<ion-icon name="navigate"></ion-icon>
</button>
icon only buttons
<button clear item-right (click)="testClick($event)">
icon only buttons default
<button clear item-right default (click)="testClick($event)">
<ion-icon name="navigate"></ion-icon>
</button>
</ion-item>
<ion-item>
ion-item right icon/text button
<button item-right (click)="testClick($event)">
ion-item right icon/text button large
<button item-right large (click)="testClick($event)">
<ion-icon name="refresh"></ion-icon>
Refresh
</button>
</ion-item>
<ion-item>
<button clear item-left (click)="testClick($event)">
<button clear item-left small (click)="testClick($event)">
<ion-icon name="settings"></ion-icon>
Settings
</button>
ion-item left clear button
ion-item left clear button small
</ion-item>
<ion-item>