Added search. Converted to bootstrap

beer-list.component.html

@@ -1,19 +1,19 @@
-<div class="container">
+<div class="col-md-12">
   <div class="row">
-    <div class="col-md-offset-3 col-md-6">
+    <div class="col-md-6">
 
-      <h2>My Beers</h2>
+      <h2>Beers</h2>
       <ul class="heroes">
         <li *ngFor="let beer of beers" (click)="onSelect(beer)" [class.selected]="beer === selectedBeer">
           <span class="badge"> {{beer.id}} </span> {{beer.name}}
         </li>
       </ul>
-      <div *ngIf="selectedBeer">
+    </div>
+      <div *ngIf="selectedBeer" class="col-md-4">
         <h2>
           {{selectedBeer.name | uppercase}} is my favorite beer!
         </h2>
-        <button (click)="gotoDetail()">View Details</button>
+        <button class="btn btn-primary" (click)="gotoDetail()">View Details</button>
       </div>
-    </div>
   </div>
 </div>