adventures.html

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

<head>
	<!--5ETOOLS_VERSION-->
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">

	<title>Adventures - 5etools</title>

	<link rel="stylesheet" href="css/bootstrap.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="icon" href="favicon.png">

	<script type="text/javascript" src="lib/js-cookie.js"></script>
	<script type="text/javascript" src="js/styleswitch.js"></script>
	<script type="text/javascript" src="js/navigation.js"></script>
	<style>
		body {
			overflow-y: scroll;
		}

		#listcontainer > ul > li {
			max-height: initial;
		}

		ul.list li:hover {
			background: inherit;
		}

		ul.list li:active {
			color: inherit;
		}

		ul.books > li:last-child,
		ul.books > li > ul > ul > li:last-child {
			border-bottom: none;
		}

		ul.list li:hover span {
			display: initial;
		}

		#listcontainer .list a.adv-name {
			display: flex;
			justify-content: space-between;
			padding: 0;
		}

		span.name {
			width: 100%;
		}

		span.name > span {
			display: inline-block;
		}
	</style>
</head>

<body>
<header class="hidden-xs hidden-sm">
	<div class="container">

		<h1>Adventures</h1>
		<p>Browse adventures by name and contents</p>
	</div>
</header>
<nav class="container" id="navigation">
	<ul class="nav nav-pills" id="navbar">
	</ul>
</nav>

<div class="container view-col-wrapper">
	<div class="view-col" id="listcontainer">
		<div class="input-group">
			<input type="search" id="search" class="search form-control" placeholder="Find adventure...">
			<span class="input-group-btn">
						<button class="btn btn-default" type="button" id="reset">Reset</button>
					</span>
		</div>

		<div id="filtertools" class="sortlabel btn-group">
			<button class="col-xs-6 sort btn btn-default btn-xs" type="button" data-sort="name">Name</button>
			<button class="col-xs-2 col-xs-2-5 sort btn btn-default btn-xs" type="button" data-sort="storyline">
				Storyline
			</button>
			<button class="col-xs-1 col-xs-1-3 sort btn btn-default btn-xs" type="button" data-sort="level">Levels
			</button>
			<button class="col-xs-2 col-xs-2-2 sort btn btn-default btn-xs" type="button" data-sort="published">
				Published
			</button>
		</div>

		<ul class="list books">
			<!-- populate with JS -->
		</ul>
	</div>
</div>

<footer class="container"></footer>    <!--5ETOOLS_SCRIPT_ANCHOR-->
<script type="text/javascript" src="js/utils.js"></script>
<script type="text/javascript" src="js/omnisearch.js"></script>
<script type="text/javascript" src="js/entryrender.js"></script>
<script type="text/javascript" src="js/bookutils.js"></script>
<script type="text/javascript" src="js/adventures.js"></script>
<script type="text/javascript" src="lib/list.js"></script>
<script type="text/javascript" src="lib/jquery.js"></script>
<script type="text/javascript" src="lib/bootstrap.js"></script>
<script type="text/javascript" src="lib/elasticlunr.js"></script>
</body>

</html>