{% extends "base.html" %}
{% load staticfiles i18n mql %}

{% block title %}Mqueue Livefeed{% endblock %}

{% block extra_head %}
<link rel="stylesheet" href="{% static 'mqueue/mqueue.css' %}" />
{% endblock %}

{% block content %}
<style>
#liveevents h1 {
	margin-bottom:0.5em;
}
#mqevents li {
	padding:0.5em 0 0.7em 0;
	border-bottom:1px solid lightgrey;
}
#reload {
	position:relative;
	top:-1em;
	display:none;
}
#reload a, #reload a:visited {
	color:lightgrey;
}
#reload a:hover {
	color:grey;
}
</style>
<div class="row">
	<div id="liveevents" class="col-xs-12 col-sm-5 col-sm-push-7">
		<h1>{% trans 'Live events' %}</h1>
		<div id="feedbox">
			<div id="feedbox_default" class="well text-center">{% trans "No events" %}</div>
		</div>
	</div>
	<div id="mqevents" class="col-xs-12 col-sm-7 col-sm-pull-5">
		<h1>{% trans 'Recent events' %}</h1>
		<span id="reload" class="pull-right">
			<a href="javascript:self.location.reload()">
				<i class="fa fa-refresh fa-2x"></i>
			</a>
		</span>
		<ul class="list-unstyled">
		{% for event in events %}
			<li>
				<a href="{% event_admin_url event %}">
					{{ event|get_badge|safe }}&nbsp;&nbsp;{{ event.name }}
				</a>
			</li>
		{% endfor %}
		</ul>
	</div>
</div>
{% endblock %}