{% extends "layout.html" %}

{% set carte = deck_name(request.path) %}
{% set og_image = self.banner_img() %}

{% block banner %}
<div class="barrins-codex-banner">
    <div class="barrins-codex-banner-img">
        {% block banner_img %}{{ img_crop(carte) }}{% endblock %}
    </div>
    {{ carte }}
</div>
{% endblock %}

{% block article %}
<article class="col-8 mx-auto mt-4">
    <div class="d-md-flex text-direction-row align-item-center justify-content-around">
        <div class="col-md-8 pe-2">
            <p>{% block ogdesc %}{% block first_paragraph %}{% endblock %}{% endblock %}</p>
            <p>{% block second_paragraph %}{% endblock %}</p>
            <p>{% block third_paragraph %}{% endblock %}</p>
        </div>
        <div class="col-md-4 d-flex flex-column">
            {% block commander %}<img src="{{ img_card(carte) }}" alt="{{ carte }}" width="100%" />{% endblock %}
            {% block liste %}{% endblock %}
        </div>
    </div>
    <div style="clear:both;"></div>
    <div class="w-100 border-bottom border-secondary border-opacity-50 border-2 mt-3"></div>
</article>

{% block friendsforever %}{% endblock %}
{% block combos %}{% endblock %}
{% block decktech %}{% endblock %}

<div class="col-12 bg-header py-4 mt-1 mb-2">
    <div class="col-8 ms-auto me-auto">
        <h2>Voir les parties de ce deck</h2>
    </div>
</div>
<article class="col-8 mx-auto">
    {% block matchs %}{% endblock %}
    <div style="clear:both;"></div>
    <div class="w-100 border-bottom border-secondary border-opacity-50 border-2 mt-4"></div>
</article>

<div class="col-12 bg-header py-4 mt-1 mb-2">
    <div class="col-8 ms-auto me-auto">
        <h2>Retrouver les pilotes de ce deck</h2>
    </div>
</div>
<article class="col-8 mx-auto mb-4 d-flex flex-wrap justify-content-around">
    <div class="row py-3 d-flex flex-wrap justify-content-around mx-auto col-12">
        {% block pilotes %}{% endblock %}
    </div>
    <div style="clear:both;"></div>
</article>
{% endblock %}
