{% load humanize %}

<style>
    th {
        text-align: left;
        padding: 8px;
    }

    td {
        border-top: 1px solid #ddd;
        padding: 8px;
    }

    .badge {
        font-size: 10px;
        color: white;
        padding: 4px;
        font-family: sans;
    }

    .new { background: #AAA; }
    .up { background: #5cb85c; }
    .down { background: #d9534f; }
    .unnamed {
        color: #888;
        font-style: italic;
    }

</style>

<p>Hello,</p>
<p>This is a notification sent by <a href="https://healthchecks.io">healthchecks.io</a>.</p>
<p>The check "{{ check.name|default:check.code }}" has gone {{ check.status }}.</p>
<p>Here is a summary of all your checks:</p>

<table>
    <tr>
        <th></th>
        <th>Name</th>
        <th>URL</th>
        <th>Frequency</th>
        <th>Last Ping</th>
    </tr>
    {% for check in checks %}
    <tr>
        <td>
            {% if check.status == "new" %}
                <span class="badge new">NEW</span>
            {% elif now < check.alert_after %}
                <span class="badge up">UP</span>
            {% else %}
                <span class="badge down">DOWN</span>
            {% endif %}
        </td>
        <td>
            {% if check.name %}
                {{ check.name }}
            {% else %}
                <span class="unnamed">unnamed</span>
            {% endif %}
        </td>
        <td class="url-cell">
            <code>{{ check.url }}</code>
        </td>
        <td>
            {% for label, value in timeout_choices %}
                {% if check.timeout == value %}
                    {{ label }}
                {% endif %}
            {% endfor %}
        </td>
        <td>
            {% if check.last_ping %}
                {{ check.last_ping|naturaltime }}
            {% else %}
                Never
            {% endif %}
        </td>
    </tr>
    {% endfor %}
</table>

<p>
    --<br />
    Regards,<br />
    healthchecks.io
</p>