<div class="row">
	<div class="col-12">
		<h1 class="h4 mb-3">{{ title }}</h1>
		<div id="toolbar" class="d-flex flex-wrap mb-3 toolbar">
			<a href="{{ admin_dir }}/settings/load-balancers/new" class="btn btn-success btn-sm">
				<em class="fas fa-plus-circle mr-2"></em>Add New
			</a>
			<button type="button" class="btn btn-info btn-sm" onclick="load_balancers.reload()">
				<em class="fas fa-sync-alt mr-2"></em>Reload
			</button>
		</div>
		<table id="tbLoadBalancers" class="table table-striped table-bordered table-hover table-sm m-0" style="width:100%">
			<thead>
				<tr>
					<th scope="col">Name</th>
					<th scope="col">Link</th>
					<th scope="col">Playbacks</th>
					<th scope="col">Status</th>
					<th scope="col">Added</th>
					<th scope="col">Updated</th>
					<th scope="col">Actions</th>
				</tr>
			</thead>
			<tfoot>
				<tr>
					<th scope="col">Name</th>
					<th scope="col">Link</th>
					<th scope="col">Playbacks</th>
					<th scope="col">Status</th>
					<th scope="col">Added</th>
					<th scope="col">Updated</th>
					<th scope="col">Actions</th>
				</tr>
			</tfoot>
		</table>
	</div>
</div>
