fix(categories): make list items anchors like component list items (#224)

willshowell · jelbourn · commit e9a709739f1d · 2017-08-29T10:47:52.000-07:00
diff --git a/material.angular.io/src/app/pages/component-category-list/component-category-list.html b/material.angular.io/src/app/pages/component-category-list/component-category-list.html
@@ -1,9 +1,10 @@
 <div class="docs-component-category-list">
-  <md-card
-      *ngFor="let category of docItems.getItemsInCategories()"
-      class="docs-component-category-list-card"
-      [routerLink]="['/categories/', category.id]">
-    <md-card-title>{{category.name}}</md-card-title>
-    <p class="docs-component-category-list-card-summary">{{category.summary}}</p>
-  </md-card>
+  <a *ngFor="let category of docItems.getItemsInCategories()"
+    class="docs-component-category-list-item"
+    [routerLink]="['/categories/', category.id]">
+    <md-card class="docs-component-category-list-card">
+      <md-card-title>{{category.name}}</md-card-title>
+      <p class="docs-component-category-list-card-summary">{{category.summary}}</p>
+    </md-card>
+  </a>
 </div>
diff --git a/material.angular.io/src/app/pages/component-category-list/component-category-list.scss b/material.angular.io/src/app/pages/component-category-list/component-category-list.scss
@@ -10,8 +10,7 @@
   }
 }
 
-.docs-component-category-list-card {
-  cursor: pointer;
+.docs-component-category-list-item {
   display: inline-block;
   margin: 20px;
   vertical-align: top;
@@ -20,6 +19,10 @@
   .mat-card-title {
     font-size: 20px;
   }
+
+  &, &:active, &:hover, &:focus {
+    text-decoration: none;
+  }
 }
 
 .docs-component-category-list-card-summary {

Original file line number	Diff line number	Diff line change
`@@ -10,8 +10,7 @@`
`10`	`10`	`}`
`11`	`11`	`}`
`12`	`12`
`13`		`-.docs-component-category-list-card {`
`14`		`- cursor: pointer;`
	`13`	`+.docs-component-category-list-item {`
`15`	`14`	`display: inline-block;`
`16`	`15`	`margin: 20px;`
`17`	`16`	`vertical-align: top;`
`@@ -20,6 +19,10 @@`
`20`	`19`	`.mat-card-title {`
`21`	`20`	`font-size: 20px;`
`22`	`21`	`}`
	`22`	`+`
	`23`	`+ &, &:active, &:hover, &:focus {`
	`24`	`+ text-decoration: none;`
	`25`	`+ }`
`23`	`26`	`}`
`24`	`27`
`25`	`28`	`.docs-component-category-list-card-summary {`