{% extends "pages/main.html" %}
{% load staticfiles %}
{% block title %} AccMon {% endblock %}

{% block container %}

<div class="jumbotron">
      <div class="container">
        <h1>Welcome to AccMon</h1>
        <p></p>
        <p><a class="btn btn-primary btn-lg" href="{% url 'monitors' %}" role="button">Show monitors status &raquo;</a></p>
      </div>
</div>
<div class="container">
    <div class="row">
        <div class="col-md-4">
            <h2>AccMon status</h2>
            <ul class="list-group">
                <li class="list-group-item"> <span class="badge" style="background-color:red;"> {{ violations_nbr }} </span> Violations number</li>
                <li class="list-group-item"> <span class="badge" style="background-color: orange;"> {{ audits_nbr }} </span> Audits number</li>
                <li class="list-group-item"> <span class="badge" style="background-color: #5bc0de;"> {{ running_mons }} </span> Running monitors</li>
                <li class="list-group-item"> <span class="badge"> {{ offline_mons }} </span> Offline monitors</li>
            </ul>
        </div>

        <div class="col-md-4">
            <h2>Controls</h2>
            <ul class="list-group">
                {% for c in controls %}
                    <li class="list-group-item"> {{ c.name }}</li>
                {% endfor %}
            </ul>
        </div>

        <div class="col-md-4">
            <h2>Installed Apps</h2>
            <ul class="list-group">
                {% for app in apps %}
                    <li class="list-group-item"> {{ app }}</li>
                {% endfor %}
            </ul>
        </div>

    </div>
</div>

<hr>

<footer></footer>

{% endblock %}

