Feature Request: Set background color of whole md-chip

[LisaTatum]

I have not find a way to style the whole md-chip.

The only background color I could set was on the tag around the text in the md-chip like or around the md-chip-template: Both ways colorize only the text block.

<md-chip-template style="background: orange;">
                <strong>{{$chip.name}}</strong>
 </md-chip-template>

[devversion]

I don't think there will be any possibility to easily change the color of a md-chip, because whenever possible we provide theming support through our $mdTheming service but not through plain css.

[LisaTatum]

Theming would be another scenario. I think more of business logic requirements. You want to quickly get an overview which subjects you teach and this happens by a color of your choice.

NOT that you misunderstood me. I meant set the color of the md-chip not md-chips

[devversion]

@LisaTatum No, wasn't misunderstanding you, just meant md-chip instead of md-chips.

Now after your example I can understand why you want to have that, it seems to be a good feature, which should be added IMO.
👍

[LisaTatum]

I want to second my request with more uses cases from edutainment field:

You see at first glance what students are taught in which subjects. In certain school systems/classes this can really vary.

Another use case would be the administration of https://en.wikipedia.org/wiki/Periodic_table where each atom would have its certain color. Of course a round chip/atom would make more sense instead of an oval shape. But I would already be very grateful for a colored md-chip!

[EladBezalel]

@LisaTatum A quick override will be

.math.md-chip {
  background-color: yellow;
}

<md-chip class="math">Math</md-chip>

as you can see here

[ThomasBurleson]

@EladBezalel - your approach uses Static chips... but @LisaTatum needs dynamic chips with remove features.

[EladBezalel]

@ThomasBurleson, I've just checked on every chip component, and it's working with no problem.

also my PR removes the .md-chip class, so she will only need to define the class to apply
if she needs some logic applying a class she can always use ng-class or ng-style to apply cretin style according her logic.