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

fix back button, add deprecation warnings

Browse Source
This commit is contained in:
Adam Bradley
2015-12-08 15:48:40 -06:00
parent eb39909fd5
commit ce2e4a3e32
12 changed files with 46 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
CHANGELOG.md
View File

@ -4,7 +4,7 @@
### Breaking Changes
#### CSS Refactor
##### CSS Refactor
* Attributes are now used by Ionic to add the correct CSS classes to elements
* Drastically reduced the depth of CSS selectors
@ -19,7 +19,9 @@
* ie: Gray navbars in iOS, blue navbars in MD. Identical HTML/JS
#### `<ion-nav-items>` renamed to `<ion-buttons>`
##### `<ion-nav-items>` renamed to `<ion-buttons>`
* `primary` attribute `<ion-nav-items primary>` now `<ion-buttons start>`
* `secondary` attribute `<ion-nav-items secondary>` now `<ion-buttons end>`
##### <a menu-toggle> should now be <button menu-toggle>

4
demos/list/basic-list.html
View File

@ -1,9 +1,9 @@
<ion-navbar *navbar class="show-navbar">
<a menu-toggle="leftMenu">
<button menu-toggle="leftMenu">
<icon menu></icon>
</a>
</button>
<ion-title>
Basic List

4
demos/list/inset-list.html
View File

@ -1,9 +1,9 @@
<ion-navbar *navbar class="show-navbar">
<a menu-toggle="leftMenu">
<button menu-toggle="leftMenu">
<icon menu></icon>
</a>
</button>
<ion-title>
Inset List

4
demos/list/list-headers.html
View File

@ -1,9 +1,9 @@
<ion-navbar *navbar class="show-navbar">
<a menu-toggle="leftMenu">
<button menu-toggle="leftMenu">
<icon menu></icon>
</a>
</button>
<ion-title>
List Headers

4
demos/list/no-lines-list.html
View File

@ -1,9 +1,9 @@
<ion-navbar *navbar class="show-navbar">
<a menu-toggle="leftMenu">
<button menu-toggle="leftMenu">
<icon menu></icon>
</a>
</button>
<ion-title>
No-lines List

4
demos/list/sliding-items.html
View File

@ -1,9 +1,9 @@
<ion-navbar *navbar class="show-navbar">
<a menu-toggle="leftMenu">
<button menu-toggle="leftMenu">
<icon menu></icon>
</a>
</button>
<ion-title>
Sliding Items

5
ionic/components/menu/menu-toggle.ts
View File

@ -34,6 +34,11 @@ export class MenuToggle extends Ion {
this.app = app;
this.viewCtrl = viewCtrl;
this.withinNavbar = !!navbar;
// Deprecation warning
if (this.withinNavbar && elementRef.nativeElement.tagName === 'A') {
console.warn('Menu toggles within a navbar should use <button menu-toggle> instead of <a toggle>')
}
}
/**

4
ionic/components/menu/test/multiple/page1.html
View File

@ -1,8 +1,8 @@
<ion-navbar *navbar>
<a [menu-toggle]="activeMenu">
<button [menu-toggle]="activeMenu">
<icon menu></icon>
</a>
</button>
<ion-title>
Multiple Menus
</ion-title>

2
ionic/components/navbar/navbar.ts
View File

@ -65,7 +65,7 @@ class ToolbarBackground {
selector: 'ion-navbar',
template:
'<div class="toolbar-background"></div>' +
'<button class="back-button" [hidden]="hideBackButton">' +
'<button class="back-button bar-button bar-button-default" [hidden]="hideBackButton">' +
'<icon class="back-button-icon" [name]="bbIcon"></icon>' +
'<span class="back-button-text">' +
'<span class="back-default">{{bbText}}</span>' +

3
ionic/components/text-input/label.ts
View File

@ -79,6 +79,9 @@ export class Label {
}
}
/**
* @private
*/
addClass(className) {
this.renderer.setElementClass(this.elementRef, className, true);
}

3
ionic/components/toolbar/modes/ios.scss
View File

@ -86,7 +86,8 @@ ion-title {
border-color: darken($color-value, 10%);
}
.toolbar-title {
.toolbar-title,
.bar-button-default {
color: inverse($color-value);
}
}

19
ionic/components/toolbar/toolbar.ts
View File

@ -149,7 +149,7 @@ export class ToolbarTitle extends Ion {
* @private
*/
@Directive({
selector: 'ion-buttons,[menu-toggle]'
selector: 'ion-buttons,[menu-toggle],ion-nav-items'
})
export class ToolbarItem {
constructor(
@ -160,6 +160,23 @@ export class ToolbarItem {
toolbar && toolbar.addItemRef(elementRef);
navbar && navbar.addItemRef(elementRef);
this.inToolbar = !!(toolbar || navbar);
// Deprecation warning
if (elementRef.nativeElement.tagName === 'ION-NAV-ITEMS') {
if (elementRef.nativeElement.hasAttribute('primary')) {
console.warn('<ion-nav-items primary> has been renamed to <ion-buttons start>, please update your HTML');
elementRef.nativeElement.setAttribute('start', '');
} else if (elementRef.nativeElement.hasAttribute('secondary')) {
console.warn('<ion-nav-items secondary> has been renamed to <ion-buttons end>, please update your HTML');
elementRef.nativeElement.setAttribute('end', '');
} else {
console.warn('<ion-nav-items> has been renamed to <ion-buttons>, please update your HTML');
}
}
}
@ContentChildren(Button)