item-start and item-end make more sense for RTL
* refactor(item): replaced item-left with item-start
replaced item-right with item-end
* style(item): fix spacing
* fix(item): add backwards support for left/right in ng-content
* fix(item): deprecated old variables, not breaking change
* fix(scss): fix variable name
* fix(item): old attributes deprecated support
* floating label rtl fix
add rtl fix to floating label
* single block, not nesting
* fix(floating-label): wp and ios issue for rtl
problems with transform-origin with both windows and ios platform for
rtl and also wrong translate3d for rtl for windows platform
* style(floating-label): remove html, 2 space indent
remove reference of "html", just plain '[dir="rtl"]
indent 2 space instead of 4
* refactor(floating-label): remove duplicate rule
remove unnecessary duplicate rule
BREAKING CHANGES:
Colors should be passed in the `color` input on components, not added
individually as an attribute on the component.
For example:
```
<ion-tabs primary>
```
Becomes
```
<ion-tabs color=”primary”>
```
Or to bind an expression to color:
```
<ion-navbar [color]="barColor">
...
</ion-navbar>
```
```ts
@Component({
templateUrl: 'build/pages/about/about.html'
})
export class AboutPage {
barColor: string;
constructor(private nav: NavController, platform: Platform) {
this.barColor = platform.is('android') ? 'primary' : 'light';
}
}
```
Reason for this change:
It was difficult to dynamically add colors to components, especially if
the name of the color attribute was unknown in the template.
This change keeps the css flat since we aren’t chaining color
attributes on components and instead we assign a class to the component
which includes the color’s name.
This allows you to easily toggle a component between multiple colors.
Speeds up performance because we are no longer reading through all of
the attributes to grab the color ones.
references #7467closes#7087closes#7401closes#7523
