Create additional modals for 'Friends' tab

index.html

@@ -242,6 +242,68 @@
 			</div>
 		</div>
 	</div>
+	<div class="modal fade" id="addFriend">
+		<div class="modal-dialog">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal">&times;</button>
+					<h4 class="modal-title">Add a Friend</h4>
+					<small>Add friends to assign tasks and get motivated :)</small>
+				</div>
+				<div class="modal-body">
+					<form action="submit" class="form-horizontal">
+						<div class="form-group">
+							<label for="friendName" class="col-lg-4 control-label">Friend's name</label>
+							<div class="col-lg-8">
+								<input type="text" class="form-control" id="friendName" placeholder="Friend name">
+							</div>
+						</div>
+						<div class="form-group">
+							<label for="friendEmail" class="col-lg-4 control-label">Email</label>
+							<div class="col-lg-8">
+								<input type="text" class="form-control" id="friendEmail" placeholder="Friend's email address">
+							</div>
+						</div>
+					</form>
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-primary">Add friend</button>
+				</div>
+			</div>
+		</div>
+	</div>
+	<div class="modal fade" id="shareToFriend">
+		<div class="modal-dialog">
+			<div class="modal-content">
+				<div class="modal-header">
+					<button type="button" class="close" data-dismiss="modal">&times;</button>
+					<h4 class="modal-title">Share to a Friend</h4>
+					<small>Share list by email for viewing only</small>
+				</div>
+				<div class="modal-body">
+					<form action="submit" class="form-horizontal">
+						<div class="form-group">
+							<label for="friendName" class="col-lg-4 control-label">Friend's name</label>
+							<div class="col-lg-8">
+								<input type="text" class="form-control" id="friendName" placeholder="Friend name">
+							</div>
+						</div>
+						<div class="form-group">
+							<label for="friendEmail" class="col-lg-4 control-label">Email</label>
+							<div class="col-lg-8">
+								<input type="text" class="form-control" id="friendEmail" placeholder="Friend's email address">
+							</div>
+						</div>
+					</form>
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+					<button type="button" class="btn btn-primary">Add friend</button>
+				</div>
+			</div>
+		</div>
+	</div>
 </div>
 <div class="footer">
 	<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>