Part-14/index.html

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title>Link Saver</title>
	<link rel="stylesheet" href="app.css">
</head>

<body>

	<nav id="nav">
		<div class="container" id="navContainer">
			<h1 class="nav-header">Link Saver</h1>
			<a id="addBtn">+</a>
		</div>
	</nav>

	<div class="container">

		<div id="addLinkContainer" class="full-screen-opaque hidden">
			<div class="panel" id="addLinkPanel">
				<h3 class="header">Add Link</h3>
				<form id="addLinkForm">
					<input type="text" name="title" id="linkTitle" class="form-control" placeholder="Title">
					<input type="text" name="url" id="linkUrl" class="form-control" placeholder="URL">
					<input type="text" name="category" id="linkCategory" class="form-control" placeholder="Categories (comma separated)">

					<div id="addedCategories">

					</div>

					<input type="submit" id="submitButton" value="Submit">
					<input type="submit" id="cancelButton" value="Cancel">

				</form>
			</div>
		</div>

		<div id="linksList">

			<div class="link panel">
				<div class="link-options">
					<button class="btn-sm">Delete</button>
					<button class="btn-sm">Edit</button>

				</div>

				<a href="http://www.jamesqquick.com">
					<h1 class="header">Link Title</h1>
				</a>
				<p class="link-date">12/25/2017</p>

				<div class="categories">
					Categories:
					<span class="category">Web Development</span>
					<span class="category">Javascript</span>

				</div>
			</div>


		</div>
	</div>

	<script src="app.js"></script>
</body>

</html>