Button icon

[ghost]

Hi,
Today I created a new angular 2 app, using material, with all the latest versions: ang2 RC5 (with this new NgModule) and material components alpha.7-2, and I have this strange behavior... Everything works but, when I click the button on my navbar, this wierd, almost transparent area around that button appears, and it gets larger with every new click, and it is also clickable, like it is a part of the button. I can not understand what this is, and why it appears after click. Before I click the button, it is not there. ... And there is no Plunker for this, because it only implements RC4, and I'm using RC5.

Here is the navbar html:

<md-sidenav-layout fullscreen>
  <md-sidenav #sidenav>
    <md-toolbar color="primary">
      <button md-icon-button (click)="sidenav.close()">
        <md-icon>chevron_left</md-icon>
      </button>
      <h3 class="title">Menu</h3>
    </md-toolbar>
    <md-list>
      <a md-list-item *ngFor="let view of views"
         (click)="sidenav.close()">
        <md-icon md-list-icon>{{view.icon}}</md-icon>
        <span md-line>{{view.name}}</span>
        <span md-line>{{view.description}}</span>
      </a>
    </md-list>
  </md-sidenav>
  <md-toolbar color="primary" fullscreen>
    <button md-icon-button (click)="sidenav.open()">
      <md-icon>menu</md-icon>
    </button>
    <h3 class="title">My App</h3>
  </md-toolbar>
  <router-outlet></router-outlet>
</md-sidenav-layout>

And here is how I see the page and that strange something:

Tnx

[fxck]

see #972 + 61027e9

[ghost]

... Adding core.css and/or overlay.css did not solve the problem for me.

[ghost]

My bad, core.css did solve it. ... I made typo in <link... core.css" >
It's OK now.
Tnx @fxck

[trainerbill]

I am having a similar issue. Is there a plunker template for alpha7 that I can try and reproduce? I have a button/icon in a toolbar:

<md-toolbar color="primary">
  <button md-mini-fab (click)="leftNavToggle()">
    <md-icon>menu</md-icon>
  </button>
  <span>{{header}}</span>
</md-toolbar>

Everything is good on render:

After clicking the button I get an overlay that stays and is clickable:

I have included core.css and overlay.css

[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.}