styling

Author: Ian Redpath

public/project/components/libraries/libraries.view.html

@@ -1,6 +1,10 @@
 <div *ngIf='!fetchingLibraries' class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2">
 	<h1>Libraries</h1>
-	<div *ngFor="#library of libraries">
-		<button [routerLink]='["/Library", { library: library.id }]'>{{library.name}}</button>
+	<div class="libraries">
+		<ul>
+			<li *ngFor="#library of libraries" class="library">
+        		<a class="thumbnail" [routerLink]="['/Library', { library: library.id }]">{{library.name}}</a>
+      		</li>
+      	</ul>
 	</div>
 </div>

public/project/components/movies/movie.view.html

@@ -51,7 +51,9 @@ <h1 class="movie-title">{{movie.title}}</h1>
   <div class="col-sm-12 col-md-12" *ngIf="!fetchingLibraries">
     <h3>Libraries With This Title</h3>
     <div class="movie-in-libraries">
-      <button  *ngFor="#library of libraries" class="btn btn-default" [routerLink]="['/Library', { library: library.id }]">{{library.name}}</button>
+      <div *ngFor="#library of libraries" class="movie-in-library">
+        <a class="thumbnail" [routerLink]="['/Library', { library: library.id }]">{{library.name}}</a>
+      </div>
     </div>
   </div>
 </div>

public/project/css/style.css

@@ -37,6 +37,10 @@
 	width: 75px;
 	display: inline-block;
 }
+.movie-in-library {
+	width: 120px;
+	display: inline-block;
+}
 .user-library {
 	width: 120px;
 	display: inline-block;
@@ -50,38 +54,7 @@
 .profile-header {
 	display: inline-block;
 }
-
-/*span.glyphicon:hover {
-	cursor: pointer;
-	color: #337ab7;
-	text-decoration: none;
-}
-
-.icon-div-2 > span {
-	width: 50%;
-	max-width: 30px;
-	float: left;
+.library {
+	width:150px;
 }
 
-.icon-div-4 > span {
-	width: 25%;
-	max-width: 30px;
-	float: left;
-}
-
-.icon-div-4 > .left-spacer {
-	height: 1px; /* will not space without height >= 1 /
-}
-.nav-tabs {
-	margin-bottom: 25px;
-}
-
-.add-new-field-div {
-	border-top: 1px solid #eee;
-	margin-top: 20px;
-	padding-top: 20px;
-}
-
-.nav > li > a:hover {
-	cursor: pointer;
-}*/