message: docs: edit styleguide recommendation on components as elements
  Change recommendation on using attributes for components since there are use cases including the use of <button mat-button> in MD
  Closes
  PR Close
diff: @@ -3773,8 +3773,7 @@ A typical *lazy loaded folder* contains a *routing component*, its child compone
  <div class="s-rule do">
  -
  -**Do** give components an _element_ selector, as opposed to _attribute_ or _class_ selectors.
  +**Consider** giving components an _element_ selector, as opposed to _attribute_ or _class_ selectors.
  </div>
  @@ -3803,7 +3802,11 @@ Developers place components on the page as they would native HTML elements and w
  </div>
  +<div class="l-sub-section">
  +
  +There are a few cases where you give a component an attribute, such as when you want to augment a built-in element. For example, [Material Design](https://material.angular.io/components/button/overview) uses this technique with `<button mat-button>`. However, you wouldn't use this technique on a custom element.
  +</div>
  <code-example path="styleguide/src/05-03/app/heroes/shared/hero-button/hero-button.component.avoid.ts" region="example" title="app/heroes/hero-button/hero-button.component.ts">
  @@ -3819,8 +3822,6 @@ Developers place components on the page as they would native HTML elements and w
  -
  -
  <code-tabs>
  <code-pane title="app/heroes/shared/hero-button/hero-button.component.ts" path="styleguide/src/05-03/app/heroes/shared/hero-button/hero-button.component.ts" region="example">
  