{% extends 'base.html' %}

{% block header %}
<h1>Messages for {{ area }} </h1>
{% endblock %}

{% block content %}

<div class="small-10 medium-12 large-12 cell">

<div class="grid-x">
<div class="small-10 medium-12 large-12 cell">
<a href="{{ url_for('list_bases') }}">Back to Message Base Areas</a>
</div>
<div class="small-10 medium-12 large-12 cell">
{{ pagination.info }}
</div>
<div class="small-10 medium-12 large-12 cell">
{{ pagination.links }}
</div>
</div>

<div class="grid-x padding-x">
<div class="small-2 medium-1 large-1 cell head">Msg #</div>
<div class="hide-for-small-only medium-3 large-2 cell head">Written</div>
<div class="small-2 medium-2 large-2 cell head">From</div>
<div class="small-2 medium-2 large-2 cell head">To</div>
<div class="small-4 medium-4 large-5 cell head">Subject</div>
</div>

{% for msg in messages %}
<div class="grid-x padding-x">
<div class="small-2 medium-1 large-1 cell"><a href="{{ url_for('display_message', area=area, msgno=msg.MsgNum) }}">{{ msg.MsgNum }}</a></div>
<div class="hide-for-small-only medium-3 large-2 cell">{{ msg.written|datefmt }}</div>
<div class="small-2 medium-2 large-2 cell">{{ msg.from }}</div>
<div class="small-2 medium-2 large-2 cell">{{ msg.to }}</div>
<div class="small-4 medium-4 large-5 cell"><a href="{{ url_for('display_message', area=area, msgno=msg.MsgNum) }}">{{ msg.subject }}</a></div>
</div>
{% endfor %}
<div class="small-10 medium-12 large-12 cell">
{{ pagination.links }}
</div>

</div>

{% endblock %}