docs(table): remove header from table overview (#5855)

* docs(table): remove header from table overview

* Add newline

* add newline

src/material-examples/table-overview/table-overview-example.css

@@ -19,7 +19,6 @@
 .mat-input-container {
   font-size: 14px;
   flex-grow: 1;
-  margin-left: 32px;
   margin-top: 8px;
 }
 
@@ -34,8 +33,6 @@
 /** Selection styles */
 .example-selection-header {
   font-size: 18px;
-  background: rgba(255, 64, 129, 0.3);
-  border-bottom: 1px solid #d696ac;
 }
 
 .mat-column-select {

src/material-examples/table-overview/table-overview-example.html

@@ -1,15 +1,16 @@
+<div class="example-header" [style.display]="selection.isEmpty() ? '' : 'none'">
+  <md-input-container floatPlaceholder="never">
+    <input mdInput #filter placeholder="Filter users">
+  </md-input-container>
+</div>
+<div class="example-header example-selection-header"
+     *ngIf="!selection.isEmpty()">
+  {{selection.selected.length}}
+  {{selection.selected.length == 1 ? 'user' : 'users'}}
+  selected
+</div>
+
 <div class="example-container mat-elevation-z8">
-  <div class="example-header" [style.display]="selection.isEmpty() ? '' : 'none'">
-    <md-input-container floatPlaceholder="never">
-      <input mdInput #filter placeholder="Filter users">
-    </md-input-container>
-  </div>
-  <div class="example-header example-selection-header"
-       *ngIf="!selection.isEmpty()">
-    {{selection.selected.length}}
-    {{selection.selected.length == 1 ? 'user' : 'users'}}
-    selected
-  </div>
 
   <md-table #table [dataSource]="dataSource" mdSort>
 
@@ -58,8 +59,8 @@
 
     <md-header-row *cdkHeaderRowDef="displayedColumns"></md-header-row>
     <md-row *cdkRowDef="let row; columns: displayedColumns;"
-             [class.example-selected-row]="selection.isSelected(row.id)"
-             (click)="selection.toggle(row.id)">
+            [class.example-selected-row]="selection.isSelected(row.id)"
+            (click)="selection.toggle(row.id)">
     </md-row>
   </md-table>
 

src/material-examples/table-overview/table-overview-example.ts

@@ -129,6 +129,9 @@ export class ExampleDataSource extends DataSource<any> {
               private _paginator: MdPaginator,
               private _sort: MdSort) {
     super();
+
+    // Reset to the first page when the user changes the filter.
+    this._filterChange.subscribe(() => this._paginator.pageIndex = 0);
   }
 
   /** Connect function called by the table to retrieve one stream containing the data to render. */