fix(typography): deprecation warning if null font family is passed in (angular#9002)

* Fixes a deprecation warning that gets logged by `mat-font-family` if the consumer passes in `null` as the `font-family`.
* Adds better handling if any of the typography properties are null.

Fixes angular#8973.

Author: crisbeto

src/lib/core/typography/_typography-utils.scss

@@ -26,7 +26,7 @@
     $font-family: _mat-get-type-value($config, $level, font-family);
   }
 
-  @return unquote($font-family);
+  @return if($font-family == null, $font-family, unquote($font-family));
 }
 
 // Converts a typography level into CSS styles.
@@ -36,8 +36,26 @@
   $line-height: mat-line-height($config, $level);
   $font-family: mat-font-family($config, $level);
 
-  // Use the shorthand `font` to represent a typography level, because it's the shortest. Notes that
-  // we need to use interpolation for `font-size/line-height` in order to prevent SASS from dividing
-  // the two values.
-  font: $font-weight #{$font-size}/#{$line-height} $font-family;
+  // If any of the values are set to `inherit`, we can't use the shorthand
+  // so we fall back to passing in the individual properties.
+  @if ($font-size == inherit or
+       $font-weight == inherit or
+       $line-height == inherit or
+       $font-family == inherit or
+       $font-size == null or
+       $font-weight == null or
+       $line-height == null or
+       $font-family == null) {
+
+    font-size: $font-size;
+    font-weight: $font-weight;
+    line-height: $line-height;
+    font-family: $font-family;
+  }
+  @else {
+    // Otherwise use the shorthand `font` to represent a typography level, because it's the the
+    // least amount of bytes. Note that we need to use interpolation for `font-size/line-height`
+    // in order to prevent SASS from dividing the two values.
+    font: $font-weight #{$font-size}/#{$line-height} $font-family;
+  }
 }