Commit Graph

5 Commits

Author SHA1 Message Date
Adam Bradley
52ada1ca6d chore(components): ngmodule updates 2016-09-13 17:07:33 -05:00
Brandy Carney
16df3a4aab refactor(css): update theme imports 2016-09-13 16:57:32 -05:00
Brandy Carney
750cde38e2 refactor(css): scope component css to mode 2016-09-13 16:52:47 -05:00
Adam Bradley
d7be8a80c0 test(ngmodule): update to ngmodule 2016-09-13 15:44:02 -05:00
Brandy Carney
55a0257dbc refactor(colors): color should be added as an input instead of directly adding the color to the component
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 #7467
closes #7087 closes #7401 closes #7523
2016-08-23 17:16:55 -04:00