{% extends '@Core/admin/layout.html.twig' %}

{% block title %}{{ 'Articles'|trans }} - {{ parent() }}{% endblock %}

{% block body %}
    <div class="bg-light pl-5 pr-4 pt-5 pb-5">
        <div class="crud-header">
            <h1 class="crud-header-title">{{ entity.title }}</h1>

            <div class="crud-header-actions">
                <div class="btn-group">
                    <a href="{{ path('admin_blog_post_index') }}" class="btn btn-secondary">
                        <span class="fa fa-list pr-1"></span>

                        Retour à la liste
                    </a>
                    <a href="{{ path('admin_blog_post_edit', {entity: entity.id}) }}" class="btn btn-primary">
                        <span class="fa fa-edit pr-1"></span>

                        Éditer
                    </a>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-md-3 p-3">
            <ul class="list-group">
                <li class="list-group-item">
                    <span class="font-weight-bold pb-2 d-block">Titre</span>

                    {{ entity.title }}
                </li>
                <li class="list-group-item">
                    <span class="font-weight-bold pb-2 d-block">Catégories</span>

                    {% for category in entity.categories %}
                        <a class="d-block" href="{{ path('admin_blog_post_show', {entity: category.id}) }}">{{ category.title }}</a>
                    {% endfor %}
                </li>
                <li class="list-group-item">
                    <span class="font-weight-bold pb-2 d-block">Tags</span>

                    {% for tag in entity.tags %}
                        <span class="d-block">{{ tag.label }}</span>
                    {% endfor %}
                </li>
                <li class="list-group-item">
                    <span class="font-weight-bold pb-2 d-block">Slug</span>

                    {{ entity.slug }}
                </li>
            </ul>
            {% if entity.isQuick %}
                <ul class="list-group mt-3">
                    <li class="list-group-item">
                        <span class="font-weight-bold pb-2 d-block">QUICK</span>
                    </li>
                    <li class="list-group-item">
                        <span class="font-weight-bold pb-2 d-block">URL</span>

                        <a href="{{ entity.quickUrl }}" target="_blank">
                            {{ entity.quickUrl }}
                        </a>
                    </li>
                    <li class="list-group-item">
                        <span class="font-weight-bold pb-2 d-block">Image</span>

                        {% if entity.quickImage %}
                            <a href="{{ entity.quickImage }}" target="_blank">
                                <img src="{{ entity.quickImage }}" class="img-fluid">
                            </a>
                        {% else %}
                            -
                        {% endif %}
                    </li>
                    <li class="list-group-item">
                        <span class="font-weight-bold pb-2 d-block">Vidéo</span>

                        {% if entity.quickVideo %}
                            <a href="{{ entity.quickVideo }}" target="_blank">
                                {{ entity.quickVideo }}
                            </a> ({{ [entity.quickVideoWidth, entity.quickVideoHeight]|join(' x ') }})
                        {% else %}
                            -
                        {% endif %}
                    </li>
                </ul>
            {% endif %}
        </div>
        <div class="col-md-6 p-3" id="post-content">
            <div class="font-weight-bold pb-2">Contenu</div>

            {% if entity.contentFormat == 'html' %}
                {{ entity.content|raw|nl2br }}
            {% else %}
                {{ entity.content|markdown('post') }}
            {% endif %}

            {% if entity.notebook %}
                <hr>

                <div class="font-weight-bold pb-2">Carnet de notes</div>

                {{ entity.notebook|markdown('post') }}
            {% endif %}
        </div>
        <div class="col-md-3 p-3">
            <ul class="list-group">
                <li class="list-group-item">
                    <span class="font-weight-bold pb-3 d-block">Image</span>

                    {% if entity.image %}
                        <figure>
                            <img src="{{ asset(entity.image.pathname) }}" class="img-fluid">
                        </figure>
                    {% else %}
                        -
                    {% endif %}
                </li>

                <li class="list-group-item">
                    <span class="font-weight-bold pb-2 d-block">Statut</span>

                    {% if entity.status == 0 %}
                        Brouillon
                    {% else %}
                        Publié
                    {% endif %}
                </li>
                <li class="list-group-item">
                    <span class="font-weight-bold pb-2 d-block">Date de publication</span>

                    {{ entity.publishedAt ? entity.publishedAt|date('d/m/Y H:i') : '-' }}
                </li>
            </ul>
        </div>
     </div>
{% endblock %}

{% block css %}
    {{ parent() }}

    <style>
        #post-content img {
            max-width: 100%;
        }
    </style>
{% endblock %}