fix(chips): removed redundant class the enable custom colors on chips

* `.md-chip` class was redundant and it's selector was stronger than the user selector, removing this class enables the user to define a class that won't be overridden by the chip style

fixes #6965

> #breaking

Closes #7051

src/components/chips/chips-theme.scss

@@ -5,7 +5,7 @@ md-chips.md-THEME_NAME-theme {
       box-shadow: 0 2px '{{primary-color}}';
     }
   }
-  .md-chip {
+  md-chip {
     background: '{{background-300}}';
     color: '{{background-800}}';
     &.md-focused {

src/components/chips/chips.scss

@@ -14,7 +14,7 @@ $contact-chip-name-width: rem(12) !default;
 
 .md-contact-chips {
   .md-chips {
-    .md-chip {
+    md-chip {
       @include rtl(padding, $contact-chip-padding, rtl-value($contact-chip-padding));
       .md-contact-avatar {
         @include rtl(float, left, right);
@@ -63,7 +63,7 @@ $contact-chip-name-width: rem(12) !default;
   &:not(.md-readonly) {
     cursor: text;
 
-    .md-chip:not(.md-readonly) {
+    md-chip:not(.md-readonly) {
       @include rtl-prop(padding-right, padding-left, $chip-remove-padding-right);
 
       ._md-chip-content {
@@ -72,7 +72,7 @@ $contact-chip-name-width: rem(12) !default;
     }
   }
 
-  .md-chip {
+  md-chip {
     cursor: default;
     border-radius: $chip-height / 2;
     display: block;

src/components/chips/demoBasicUsage/style.scss

@@ -5,7 +5,7 @@
 }
 
 .custom-chips {
-  .md-chip {
+  md-chip {
     position: relative;
     ._md-chip-remove-container {
       position: absolute;

src/components/chips/js/chipDirective.js

@@ -47,7 +47,6 @@ function MdChip($mdTheming, $mdUtil) {
     element.append($mdUtil.processTemplate(hintTemplate));
 
     return function postLink(scope, element, attr, ctrl) {
-      element.addClass('md-chip');
       $mdTheming(element);
 
       if (ctrl) angular.element(element[0].querySelector('._md-chip-content'))