mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
88 lines
3.4 KiB
Markdown
88 lines
3.4 KiB
Markdown
<a name="2.0.0-alpha.42"></a>
|
|
# 2.0.0-alpha.42 (2015-12-11)
|
|
|
|
|
|
### Breaking Changes
|
|
|
|
##### CSS Refactor
|
|
|
|
* Attributes are now used by Ionic to add the correct CSS classes to elements
|
|
* Drastically reduced the depth of CSS selectors
|
|
* Further modularized Sass files to allow individual imports
|
|
* Ionic CSS comes in 3 flavors
|
|
* `ionic.css`: Core CSS, iOS CSS, and Material Design CSS
|
|
* `ionic.ios.css`: Core CSS and iOS CSS
|
|
* `ionic.md.css`: Core CSS and Material Design CSS
|
|
* App's `index.html` file can be setup to dynamically load only the stylesheet it needs
|
|
* Different Sass color maps for iOS and Material Design
|
|
* Allows colors to be different per platform
|
|
* ie: Gray navbars in iOS, blue navbars in MD. Identical HTML/JS
|
|
* config: `tabbarStyle`, `navbarStyle` has been removed, should now use different Sass color maps instead of setting it in the config
|
|
* text-input: class `has-value` has become `input-has-value`
|
|
* text-input: class `has-focus` has become `input-focused`
|
|
* searchbar: class `left-align` has become `searchbar-left-aligned`
|
|
* searchbar: class `focused` has become `searchbar-focused`
|
|
|
|
|
|
##### `<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 menuToggle>`
|
|
|
|
* If a menu is not given an `id`, then it is automatically assigned an id, such as `leftMenu` or `rightMenu`.
|
|
* If the menu toggle/close directives are not given a value then it tries the menu ids of `leftMenu` then `rightMenu`.
|
|
|
|
##### `<ion-switch>` renamed to `<ion-toggle>`
|
|
|
|
* Consistent naming with Ionic v1
|
|
* Reduce potential confusion with `ng-switch`
|
|
|
|
|
|
##### Bug Fixes
|
|
|
|
* **item-sliding**: fixed item-sliding, onDragEnd on mouseout of sliding element [f9199fb](https://github.com/driftyco/ionic2/commit/f9199fb3be6ce6b0a693e2e3b944b47ed8575531), closes [#702](https://github.com/driftyco/ionic2/issues/702)
|
|
|
|
|
|
##### Features
|
|
|
|
* Upgraded to Angular alpha.50
|
|
* Life cycle hooks are now prefixed with `ng`
|
|
* ngOnChanges
|
|
* ngOnInit
|
|
* ngDoCheck
|
|
* ngAfterContentInit
|
|
* ngAfterContentChecked
|
|
* ngAfterViewInit
|
|
* ngAfterViewChecked
|
|
* ngOnDestroy
|
|
|
|
### Steps to Upgrade to alpha.42
|
|
|
|
|
|
1. Update to latest beta CLI: `npm install -g ionic@beta`
|
|
2. Convert dash attributes to camelCase (see [Angular Changelog](https://github.com/angular/angular/blob/master/CHANGELOG.md#200-alpha52-2015-12-10))
|
|
3. Remove sass imports in JS files
|
|
4. Update css reference in index.html (remove build/css/app.css if it exists)
|
|
|
|
```
|
|
<link ios-href="build/css/app.ios.css" rel="stylesheet">
|
|
<link md-href="build/css/app.md.css" rel="stylesheet">
|
|
```
|
|
|
|
5. Add core stylesheets (copy from a starter or conf app) and remove app.scss:
|
|
|
|
```
|
|
app.core.scss
|
|
app.ios.scss
|
|
app.md.scss
|
|
app.variables.scss
|
|
```
|
|
|
|
6. Update `app.core.scss` to reflect your Sass files
|
|
7. See the conference app for run steps: [Getting Started](https://github.com/driftyco/ionic-conference-app#getting-started)
|
|
8. Add the new gulp packages and gulp file found in the [ionic2-app-base](https://github.com/driftyco/ionic2-app-base) or any of the starter
|
|
9. Add the contents from the [ionic2-app-base](https://github.com/driftyco/ionic2-app-base) ionic.config.js file
|
|
10. Run `gulp sass watch` to watch and compile the sass (will be part of ionic serve in later release)
|