Color attribute: add color as an attribute to our components

This makes dynamically changing attributes easier for the user, and it will be easier to manage internally. For example:

<button primary>Button</button>

will become

<button color="primary">Button</button>

Edit: I realized button is probably a bad example since it already has this attribute, but this will benefit components like ion-navbar as well:

<ion-navbar color="secondary">
   ...
</ion-navbar>

or

<ion-navbar [color]="barColor">
   ...
</ion-navbar>

@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';
  }
}

Edit: Components that will have the color input:

• Badge
• Button
• Checkbox
• Chip
• Icon
• Item (Item, Item Divider, List Header)
• Label
• Navbar
• Radio
• Searchbar
• Segment
• Spinner
• Tabs
• Toggle
• Toolbar
• Typography (headers, paragraphs, spans, etc.)

[brandyscarney]

@albrecht-jun-zhang You can use property binding for full as well:

<button ion-button [full]="isFull">Full</button>

See: https://angular.io/docs/ts/latest/guide/template-syntax.html#!#property-binding

[szerner]

@brandyscarney I opened a new issue #7826 for my suggestion.