Stepper icon override not same size on not-touched steps

[ssoelvsten]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Should an overridden <ng-template matStepperIcon="number"> contain an icon, then the icon is aligned in size with the icons of matStepperIcon="done" and matStepperIcon="edit".

What is the current behavior?

When overriding an <ng-template matStepperIcon="number"> to contain a mat-icon the icon will fill out all the 24x24 px rather than the 16x16px of matStepperIcon="done" | "edit" when the step is not selected. This results in those icons being much larger than the icons prior to the current step

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-1pdtv3

Is there anything else we should know?

It can be fixed with the following CSS in src/lib/stepper/step-header.scss

.mat-step-icon .mat-icon,
.mat-step-icon-not-touched .mat-icon { // <= This line
 font-size: $mat-step-header-icon-size;
 height: $mat-step-header-icon-size;
 width: $mat-step-header-icon-size;
}

[crisbeto]

I'm submitting a PR for the icon sizes. For reference, the issue with the centering will be fixed in #12947.