fix(list): subheader margin being overwritten by typography

Fixes the `.mat-subheader` margin being overwritten by the `.mat-typography` due to lower specificity. Fixes angular#5639.
crisbeto · Jul 10, 2017 · 76db64c · 76db64c
1 parent 557b31b
commit 76db64c
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/demo-app/list/list-demo.html b/src/demo-app/list/list-demo.html
@@ -3,7 +3,7 @@ <h1>md-list demo</h1>
 
 <button md-raised-button (click)="thirdLine=!thirdLine" class="demo-button">Show third line</button>
 
-<div class="demo">
+<div class="demo mat-typography">
   <div>
     <h2>Normal lists</h2>
 

diff --git a/src/lib/list/list.scss b/src/lib/list/list.scss
@@ -110,7 +110,12 @@ $mat-dense-list-icon-size: 20px;
   display: block;
   box-sizing: border-box;
   padding: $mat-list-side-padding;
-  margin: 0;
+
+  // This needs slightly more specificity, because it
+  // can be overwritten by the typography styles.
+  .mat-list & {
+    margin: 0;
+  }
 }
 
 // This mixin adjusts the heights and padding based on whether the list is in dense mode.