icon-button ripple color problem

[mhebrard]

Bug, feature request, or proposal:

on a toolbar, the icon-button color follow the contrast color from the theme but the ripple do not.

What is the expected behavior?

on a toolbar, the icon-button ripple should follow the contrast color from the theme.

What is the current behavior?

on a toolbar, the icon-button ripple do not follow the contrast color from the theme.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-widrns

template

<mat-toolbar color="primary">
    <button mat-icon-button type="button">
      <mat-icon>favorite</mat-icon>
    </button>
    <nav mat-tab-nav-bar backgroundColor="primary">
      <a mat-tab-link>First</a>
      <a mat-tab-link>Second</a>
      <a mat-tab-link>Third</a>
    </nav>
  </mat-toolbar>

style

@import '~@angular/material/theming';
@include mat-core();

/* Palette generated from mcg.mbitson.com */
$md-primary: (
  50 : #fdede4,
  100 : #fbd1bd,
  200 : #f9b291,
  300 : #f69364,
  400 : #f47c43,
  500 : #f26522, // Main color
  600 : #f05d1e,
  700 : #ee5319,
  800 : #ec4914,
  900 : #e8370c,
  A100 : #ffffff,
  A200 : #ffe5e0,
  A400 : #ffbaad,
  A700 : #ffa493,
  contrast: (
    50 : #000000,
    100 : #000000,
    200 : #000000,
    300 : #000000,
    400 : #000000,
    500 : #ffffff,
    600 : #ffffff,
    700 : #ffffff,
    800 : #ffffff,
    900 : #ffffff,
    A100 : #000000,
    A200 : #000000,
    A400 : #000000,
    A700 : #000000,
  )
);

$my-primary: mat-palette($md-primary, 500, 200, 700);
$my-accent: mat-palette($mat-indigo, 700, 300, 900);
$my-warn: mat-palette($mat-red);
$my-theme: mat-light-theme($my-primary, $my-accent, $my-warn);

@include angular-material-theme($my-theme);

What is the use-case or motivation for changing an existing behavior?

Consistency between theme and components

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

test on :
Angular 6.1.7
Material 6.4.7
typescript 2.7.2
Windows 7
Chrome 69.0.3497.100

Is there anything else we should know?

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}