mat-checkbox: Change size to 18x18 to match Material Design Guidelines

[ryan-neufeld]

Bug, feature request, or proposal:

Change checkbox dimensions to 18x18 (14px x 14px + 2px border)

What is the expected behavior?

Both Material Designs Guidlines and Material Designs Sketch UI Kit show the default size of a checkbox as 18x18 (14x14 + 2px border) upon inspecting the code.

What is the current behavior?

Currently, mat-checkbox is 16x16 (12px x 12px + 2px).

What are the steps to reproduce?

StackBlitz starter: https://stackblitz.com/angular/jrrlgbvreaa?file=src%2Fapp%2Fcheckbox-overview-example.ts

Open inspect element on any live example of the component, class="mat-checkbox-frame" contains the border.

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

Consistency across Material Design implementations.

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

All.

Is there anything else we should know?

N/A

[jelbourn]

This will be fixed by the MDC-based implementation of mat-checkbox