fixed bad comment style, fixed edit library name

Author: Ian Redpath

public/project/components/libraries/library.ts

@@ -139,7 +139,7 @@ export class Library {
 
 	saveNewLibraryName() {
 		this.isEditingLibraryName = false
-		this.libraryService.updateLibrary(this.library)
+		this.libraryService.updateLibrary({ name: this.library.name })
 			.subscribe(resp => {
 				if(resp.json().library) {
 					this.backupName = this.library.name

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

@@ -1,13 +1,13 @@
 <div *ngIf='!fetchingLibrary' class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2">
-  <div>
+  <div class="library-heading">
     <div *ngIf="!isEditingLibraryName" class="library-name-container">
       <h1 *ngIf="hasEditRights()" (click)="editLibraryName()" class="clickable">{{library.name}}</h1>
       <h1 *ngIf="!hasEditRights()">{{library.name}}</h1>
     </div>
-    <div *ngIf="isEditingLibraryName">
+    <div *ngIf="isEditingLibraryName" class="library-edit">
       <input type="text" [(ngModel)]="library.name" (keyup.enter)="saveNewLibraryName()">
-      <span class="glyphicon glyphicon-check" (click)="saveNewLibraryName()"></span>
-      <button class="btn btn-default" (click)="cancelEditingLibraryName()">Cancel</button>
+      <span class="glyphicon glyphicon-check clickable-glyph" (click)="saveNewLibraryName()"></span>
+      <span class="glyphicon glyphicon-remove clickable-glyph" (click)="cancelEditingLibraryName()"></span>
     </div>
     <a [routerLink]='["/User", { user: library.user._id }]'>{{library.user.username}}</a>
   </div>
@@ -79,7 +79,7 @@ <h6 class="timestamp">{{getCommentDate(comment.date)}} {{comment.edited ? '(edit
     </div>
     <div *ngIf="userService.getActiveUser()" class="new-comment">
       <textarea class="comment-input" [(ngModel)]="newComment" (keyup.enter)="addComment()"></textarea>
-      <button class="btn" (click)="addComment()">Comment!</button>
+      <button class="btn comment-button" (click)="addComment()">Comment!</button>
     </div>
   </div>
 </div>

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

@@ -93,7 +93,7 @@ <h6 class="timestamp">{{getCommentDate(comment.date)}} {{comment.edited ? '(edit
     </div>
     <div *ngIf="userService.getActiveUser()" class="new-comment">
       <textarea class="comment-input" [(ngModel)]="newComment" (keyup.enter)="addComment()"></textarea>
-      <button class="btn" (click)="addComment()">Comment!</button>
+      <button class="btn comment-button" (click)="addComment()">Comment!</button>
     </div>
   </div>
   <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" *ngIf="!fetchingLibraries">

public/project/css/style.css

@@ -1,7 +1,12 @@
 .clickable {
 	cursor: pointer;
 }
-
+.clickable-glyph {
+	cursor: pointer;
+}
+.clickable-glyph:hover {
+	color: blue;
+}
 .movie-title {
 	margin-left: 15px;
 }
@@ -178,7 +183,7 @@
 }
 
 .new-comment {
-	margin-top: 20px;
+	margin-top: 30px;
 }
 
 .comment-img {
@@ -207,4 +212,13 @@
 }
 .comment-input {
 	width:50%;
+	vertical-align: bottom
 }
+.comment-button {
+	vertical-align: bottom
+}
+.library-edit {
+	display: inline-block;
+	margin-top: 20px;
+	margin-bottom: 10px;
+}