{% extends "main.html" %}

{% block title %}Card: {{ card.name }}{% endblock %}

{% block content %}
    <div class="card {{ card.colors|join:" " }}">
        <div class="title">
            <span class="name">{{ card.name|title }}</span>
            <span class="cost">
                {% include 'cards/manacost.html' %}
            </span>
        </div>
        <div class="picture"></div>
        <div class="info">
            <span class="type">
                {{ card.type|title }}
                &mdash;
                {% for attr in card.attributes.all %}
                    {{ attr|title }}
                {% endfor %}
            </span>
            <span class="rarity {{ card.rarity }}">
                {% for key, rarity in card.rarities.items %}
                    {% if key == card.rarity %}{{ rarity }}{% endif %}
                {% endfor %}
            </span>
        </div>
        <div class="text">
            <ul>
                {% autoescape off %}
                {% for ability in abilities %}
                    <li>{{ ability }}</li>
                {% endfor %}
                {% endautoescape %}
            </ul>
        </div>
        {% if card.toughness > '0' %}
            <div class="numbers">
                <span class="power">{{ card.power }}</span> /
                <span class="toughness">{{ card.toughness }}</span>
            </div>
        {% endif %}
    </div>
{% endblock %}