{% extends "base.html" %}

{% block content %}
    <h1 class="title is-large butter-title">Hi, welcome to the {{get_setting('butterbox_name')}}.</h1>
    <p class="subtitle butter-title"> View and download the information you want from this offline box.</p>

<div class="grid">
    {% for service in services %}
        <a class="cell button is-large is-responsive butter-service" href={{ service.url }}>
        <div class="butter-service__content"> {{ service.name }} <br>
            <img class="image is-64x64 butter-service__image" src={{ service.image }}>
        </div>
     </a>
    {% endfor %}
</div>
</hr>
    {% if display_wifi_password %}
    <div class="block" style="align-content: center; text-align: center;">
        <p>Connect to this box with wifi:
        <img class="image is-128x128" style="margin: 0 auto" src="{{ url_for('static', filename='images/wifi_qr_code.png') }}">
        </p>
    </div>
    {% endif %}

{% endblock %}