feat(progress-bar): align with 2018 material design spec (#12394)

Aligns the progress bar component with the latest version of the Material design spec.

Author: crisbeto

src/lib/progress-bar/progress-bar.html

@@ -2,10 +2,10 @@
   The background div is named as such because it appears below the other divs and is not sized based
   on values.
 -->
-<svg width="100%" height="5" focusable="false" class="mat-progress-bar-background mat-progress-bar-element">
+<svg width="100%" height="4" focusable="false" class="mat-progress-bar-background mat-progress-bar-element">
   <defs>
-    <pattern [id]="progressbarId" x="5" y="0" width="10" height="5" patternUnits="userSpaceOnUse">
-      <circle cx="2.5" cy="2.5" r="2.5"/>
+    <pattern [id]="progressbarId" x="4" y="0" width="8" height="4" patternUnits="userSpaceOnUse">
+      <circle cx="2" cy="2" r="2"/>
     </pattern>
   </defs>
   <rect [attr.fill]="_rectangleFillValue" width="100%" height="100%"/>

src/lib/progress-bar/progress-bar.scss

@@ -3,7 +3,7 @@
 @import '../core/style/noop-animation';
 @import '../../cdk/a11y/a11y';
 
-$mat-progress-bar-height: 5px !default;
+$mat-progress-bar-height: 4px !default;
 $mat-progress-bar-full-animation-duration: 2000ms !default;
 $mat-progress-bar-piece-animation-duration: 250ms !default;