A basic table containing contact Info for the Household's Primary Contact: Name Mobile Phone Home Phone Email
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
{{ helpers.bootstrap_3 }}
<style>
table { border-collapse: collapse; margin-top: 20px; }
table th { background-color: silver; font-weight: bold; text-align: left; padding: 10px; border:solid 1px #999; }
table tr td { border-bottom:solid 1px #999; padding: 10px; vertical-align: top; }
table tr td.person { background-color: #888; color: white }
table tr td.name { background-color: #eee; border-right:solid 1px #999; border-left:solid 1px #999; }
table tr td.inner { border-right:dotted 1px #bbb; }
table tr td.last {border-right:solid 1px #999; }
</style>
</head>
<body>
<div class="container">
<h1>
{{ filter.name }}
</h1>
<div>
Contact Info for the Household's Primary Contact
</div>
<table>
<thead>
<tr>
<th>Person</th>
<th>Primary Contact</th>
<th>Mobile Phone</th>
<th>Home Phone</th>
<th>Email</th>
</tr>
</thead>
{% for person in people %}
{% if person.primary_contacts == empty %}
<tr>
<td class="name">{{person.name}}</td>
<td class="inner"></td>
<td class="inner"></td>
<td class="inner"></td>
<td class="last"></td>
</tr>
{% endif %}
{% for primary_contact in person.primary_contacts %}
<tr>
<td class="name">{{person.name}}</td>
<td class="inner">{{ primary_contact.name }}</td>
<td class="inner">{% for phone_number in primary_contact.phone_numbers %}
{%if phone_number.location == "Mobile" %}{{ phone_number.number }}{% endif %}
{% endfor %}
</td>
<td class="inner">{% for phone_number in primary_contact.phone_numbers %}
{%if phone_number.location == "Home" %}{{ phone_number.number }}{% endif %}
{% endfor %}
</td>
<td class="last">
{% for email in primary_contact.emails %}
{{ email.address }}
{% endfor %}
</td>
</tr>
{% endfor %}
{% endfor %}
</table>
</div>
</body>
</html>