feat(typography): allow typography config to be passed via mat-core (#…

…5625)

Allows for the typography config to be specified optionally through the `mat-core` mixin, avoiding some of the extra bloat that comes from overriding the typography after a theme is defined.

Fixes #5589.

guides/typography.md

@@ -84,6 +84,14 @@ different SASS mixins.
 @include angular-material-typography($custom-typography);
 ```
 
+If you're using Material's theming, you can also pass in your typography config to the
+`mat-core` mixin:
+
+```scss
+// Override the typography in the core CSS.
+@include mat-core($custom-typography);
+```
+
 For more details about the typography functions and default config, see the
 [source](https://github.com/angular/material2/blob/master/src/lib/core/typography/_typography.scss).
 

src/lib/core/_core.scss

@@ -11,7 +11,7 @@
 @import 'typography/all-typography';
 
 // Mixin that renders all of the core styles that are not theme-dependent.
-@mixin mat-core() {
+@mixin mat-core($typography-config: null) {
   // Provides external CSS classes for each elevation value. Each CSS class is formatted as
   // `mat-elevation-z$zValue` where `$zValue` corresponds to the z-space to which the element is
   // elevated.
@@ -21,7 +21,7 @@
     }
   }
 
-  @include angular-material-typography();
+  @include angular-material-typography($typography-config);
   @include mat-ripple();
   @include mat-option();
   @include mat-optgroup();

src/lib/core/typography/_all-typography.scss

@@ -30,7 +30,11 @@
 
 
 // Includes all of the typographic styles.
-@mixin angular-material-typography($config: mat-typography-config()) {
+@mixin angular-material-typography($config: null) {
+  @if $config == null {
+    $config: mat-typography-config();
+  }
+
   @include mat-base-typography($config);
   @include mat-autocomplete-typography($config);
   @include mat-button-typography($config);