fix(list): align avatar size in dense list with spec

* Fixes the dense list avatar being slightly larger than the spec.
* Removes an unnecessary setter from the `MatListItem` class.

Fixes #10019.

Author: crisbeto

src/lib/list/list.scss

@@ -28,13 +28,14 @@ $mat-dense-two-line-height: 60px;
 $mat-dense-three-line-height: 76px;
 $mat-dense-multi-line-padding: 16px;
 $mat-dense-list-icon-size: 20px;
+$mat-dense-avatar-size: 36px;
 
 $mat-list-item-inset-divider-offset: 72px;
 
 // This mixin provides all list-item styles, changing font size and height
 // based on whether the list is in dense mode.
-@mixin mat-list-item-base($base-height, $avatar-height, $two-line-height,
-  $three-line-height, $multi-line-padding, $icon-size) {
+@mixin mat-list-item-base($base-height, $has-avatar-height, $two-line-height,
+  $three-line-height, $multi-line-padding, $icon-size, $avatar-size) {
 
   // Prevents the wrapper `mat-list-item-content` from collapsing due to it
   // being `inline` by default.
@@ -69,7 +70,7 @@ $mat-list-item-inset-divider-offset: 72px;
   }
 
   &.mat-list-item-avatar {
-    height: $avatar-height;
+    height: $has-avatar-height;
   }
 
   &.mat-2-line {
@@ -128,12 +129,12 @@ $mat-list-item-inset-divider-offset: 72px;
 
   .mat-list-avatar {
     flex-shrink: 0;
-    width: $mat-list-avatar-size;
-    height: $mat-list-avatar-size;
+    width: $avatar-size;
+    height: $avatar-size;
     border-radius: 50%;
 
     ~ .mat-divider-inset {
-      @include mat-inset-divider-offset($mat-list-avatar-size, $mat-list-side-padding);
+      @include mat-inset-divider-offset($avatar-size, $mat-list-side-padding);
     }
   }
 
@@ -210,7 +211,8 @@ $mat-list-item-inset-divider-offset: 72px;
       $mat-list-two-line-height,
       $mat-list-three-line-height,
       $mat-list-multi-line-padding,
-      $mat-list-icon-size
+      $mat-list-icon-size,
+      $mat-list-avatar-size
     );
   }
 }
@@ -232,7 +234,8 @@ $mat-list-item-inset-divider-offset: 72px;
       $mat-dense-two-line-height,
       $mat-dense-three-line-height,
       $mat-dense-multi-line-padding,
-      $mat-dense-list-icon-size
+      $mat-dense-list-icon-size,
+      $mat-dense-avatar-size
     );
   }
 }

src/lib/list/list.ts

@@ -98,6 +98,7 @@ export class MatListSubheaderCssMatStyler {}
   exportAs: 'matListItem',
   host: {
     'class': 'mat-list-item',
+    '[class.mat-list-item-avatar]': '_avatar',
     '(focus)': '_handleFocus()',
     '(blur)': '_handleBlur()',
   },
@@ -113,15 +114,7 @@ export class MatListItem extends _MatListItemMixinBase implements AfterContentIn
   private _isNavList: boolean = false;
 
   @ContentChildren(MatLine) _lines: QueryList<MatLine>;
-
-  @ContentChild(MatListAvatarCssMatStyler)
-  set _hasAvatar(avatar: MatListAvatarCssMatStyler) {
-    if (avatar != null) {
-      this._element.nativeElement.classList.add('mat-list-item-avatar');
-    } else {
-      this._element.nativeElement.classList.remove('mat-list-item-avatar');
-    }
-  }
+  @ContentChild(MatListAvatarCssMatStyler) _avatar: MatListAvatarCssMatStyler;
 
   constructor(private _element: ElementRef,
               @Optional() private _navList: MatNavList) {