<div class="card">
	<div class="card-header">
		<h4 class="card-title">Most Visited Pages</h4>
	</div>
	<div class="table-responsive">
		<table class="table card-table table-vcenter">

			<thead>
			<tr>
				<th>Page name</th>
				<th>Visitors</th>
				<th>Unique</th>
				<th colspan="2">Bounce rate</th>
			</tr>
			</thead>

			{% for page in site.data.pages %}
			{% assign data = page.data | join: ',' %}
			<tr>
				<td>
					{{ page.uri }}
					<a href="#" class="link-secondary ml-2">{% include ui/icon.html icon="link" %}</a>
				</td>
				<td class="text-muted">{{ page.visitors | format_number }}</td>
				<td class="text-muted">{{ page.unique | format_number }}</td>
				<td class="text-muted">{{ page.bounce-rate }}</td>
				<td class="text-right">
					{% include ui/sparkline.html type="line" data=data %}
				</td>
			</tr>
			{% endfor %}

		</table>
	</div>
</div>
