[mat-menu] with icons doesn't follows Material Design.

[Flashunt]

What is the expected behavior?

[mat-menu] elements doesn't follows the Material Design spec.
In the design spec has 24px padding left and right for a menu item, with icon.
And the icon has 20 pixel margin at right.

https://material.io/design/components/menus.html#specs

What is the current behavior?

[mat-menu-item] with icon, has padding left and right 16px, and the icon has margin right 16px.

What are the steps to reproduce?

https://stackblitz.com/angular/mdplyynpjmv?file=app%2Fmenu-icons-example.ts

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

@angular/animations7.2.8
@angular/cdk7.3.1
@angular/common7.2.8
@angular/compiler7.2.8
@angular/core7.2.8
@angular/forms7.2.8
@angular/http7.2.8
@angular/material7.3.1
@angular/material-moment-adapter7.3.1
@angular/platform-browser7.2.8
@angular/platform-browser-dynamic7.2.8
@angular/router7.2.8
angular-in-memory-web-api0.5.4
core-js2.6.5
hammerjs2.0.8
moment2.24.0
rxjs6.4.0
web-animations-js2.3.1
zone.js0.8.29

All browser.

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