{% extends "issues/warranty.html" %}
{% load i18n %}

{% block main %}
<h2>{% trans "Choose Your Device" %}</h2>
<p>Help text..</p>
<div class="devices">
    <div class="row">
        <div class="col-md-3">
            <a href="{% url 'issues-choose_device' 'mac' %}">
                <img src="{{ STATIC_URL }}img/products/mac.png"/>
                <div>{% trans "Mac" %}</div>
            </a>
        </div>
        <div class="col-md-3">
            <a href="{% url 'issues-choose_device' 'ipod' %}">
                <img src="{{ STATIC_URL }}img/products/ipod.png"/>
                <div>{% trans "iPod" %}</div>
            </a>
        </div>
        <div class="col-md-3">
            <a href="{% url 'issues-choose_device' 'iphone' %}">
                <img src="{{ STATIC_URL }}img/products/iphone.png"/>
                <div>{% trans "iPhone" %}</div>
            </a>
        </div>
        <div class="col-md-3">
            <a href="{% url 'issues-choose_device' 'ipad' %}">
                <img src="{{ STATIC_URL }}img/products/ipad.png"/>
                <div>{% trans "iPad" %}</div>
            </a>
        </div>
    </div>
    <div class="row">
        <div class="col-md-3">
            <a href="{% url 'issues-choose_device' 'other' %}">
                <img src="{{ STATIC_URL }}img/products/other.png"/>
                <div>{% trans "Other" %}</div>
            </a>
        </div>
    </div>
</div>
{% endblock main %}