e-cosplay/templates/doc.twig

{% extends 'base.twig' %}

{# --- METADATA & SCHEMA (Already using trans) --- #}
{% block title %}{{'doc_page.title'|trans}}{% endblock %}
{% block meta_description %}{{'doc_page.description'|trans}}{% endblock %}

{% block canonical_url %}<link rel="canonical" href="{{ url('app_doc') }}" />{% endblock %}
{% block breadcrumb_schema %}
    <script type="application/ld+json">
        {
          "@context": "https://schema.org",
          "@type": "BreadcrumbList",
          "itemListElement": [
            {
              "@type": "ListItem",
              "position": 1,
              "name": "{{ 'breadcrumb.home'|trans }}",
              "item": "{{ app.request.schemeAndHttpHost }}"
          },
            {
              "@type": "ListItem",
              "position": 2,
              "name": "{{ 'doc_page.breadcrumb'|trans }}",
              "item": "{{ app.request.schemeAndHttpHost }}{{ app.request.pathInfo }}"
          }
        ]
      }
    </script>
{% endblock %}

{# --- BODY with Tailwind Styling and full i18n --- #}
{% block body %}
    <div class="container mx-auto p-4 md:p-8">
        {# Main Title #}
        <h1 class="text-3xl font-bold text-gray-800 mb-6 border-b pb-2">
            {{ 'doc_list.title'|trans }}
        </h1>

        {# --- Ordinary General Assembly (AG Ordinaire) --- #}
        <section class="mb-10">
            <h2 class="text-2xl font-semibold text-indigo-600 mb-4">
                {{ 'doc_list.ag_ordinaire_title'|trans }}
            </h2>
            <div class="space-y-4">
                {% for ag in ag_ordinaire %}
                    <div class="bg-white shadow-lg rounded-lg p-5 border border-gray-200 hover:shadow-xl transition duration-300">
                        <div class="flex flex-wrap justify-between items-center mb-2 border-b pb-2">
                            <span class="text-xl font-bold text-gray-700">
                                {{ 'ag.date_at_prefix'|trans }} {{ ag.agDateAt|date('d/m/Y') }}
                            </span>
                            <span class="text-sm font-medium text-gray-500">
                                {{ 'ag.main_members_label'|trans }} : <span class="font-semibold text-gray-700">{{ ag.mainMembers.count }}</span>
                            </span>
                        </div>
                        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm text-gray-600 mb-4">
                            <div>
                                <strong class="text-gray-800">{{ 'ag.president_label'|trans }} :</strong>
                                {{ ag.president.civ }} {{ ag.president.name }} {{ ag.president.surname }}
                            </div>
                            <div>
                                <strong class="text-gray-800">{{ 'ag.secretary_label'|trans }} :</strong>
                                {{ ag.secretaire.civ }} {{ ag.secretaire.name }} {{ ag.secretaire.surname }}
                            </div>
                        </div>
                        <a
                            download="ag_normal_ecosplay_{{ ag.agDateAt|date('d-m-Y') }}.pdf"
                            href="{{ vich_uploader_asset(ag,'ag') }}"
                            class="inline-block mt-2 px-4 py-2 bg-indigo-500 text-white font-semibold rounded-lg shadow-md hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-indigo-500 focus:ring-offset-2 transition ease-in-out duration-150"
                        >
                            <i class="fas fa-file-download mr-2"></i> {{ 'ag.view_document_link'|trans }}
                        </a>
                    </div>
                {% endfor %}
            </div>
        </section>

        {# --- Extraordinary General Assembly (AG Extraordinaire) --- #}
        <section>
            <h2 class="text-2xl font-semibold text-red-600 mb-4">
                {{ 'doc_list.ag_extraordinaire_title'|trans }}
            </h2>
            <div class="space-y-4">
                {% for ag in ag_extraordinaire %}
                    <div class="bg-white shadow-lg rounded-lg p-5 border border-gray-200 hover:shadow-xl transition duration-300">
                        <div class="flex flex-wrap justify-between items-center mb-2 border-b pb-2">
                            <span class="text-xl font-bold text-gray-700">
                                {{ 'ag.date_at_prefix'|trans }} {{ ag.agDateAt|date('d/m/Y') }}
                            </span>
                            <span class="text-sm font-medium text-gray-500">
                                {{ 'ag.main_members_label'|trans }} : <span class="font-semibold text-gray-700">{{ ag.mainMembers.count }}</span>
                            </span>
                        </div>
                        <div class="grid grid-cols-1 md:grid-cols-2 gap-4 text-sm text-gray-600 mb-4">
                            <div>
                                <strong class="text-gray-800">{{ 'ag.president_label'|trans }} :</strong>
                                {{ ag.president.civ }} {{ ag.president.name }} {{ ag.president.surname }}
                            </div>
                            <div>
                                <strong class="text-gray-800">{{ 'ag.secretary_label'|trans }} :</strong>
                                {{ ag.secretaire.civ }} {{ ag.secretaire.name }} {{ ag.secretaire.surname }}
                            </div>
                        </div>
                        <a
                            download="ag_normal_ecosplay_{{ ag.agDateAt|date('d-m-Y') }}.pdf"
                            href="{{ vich_uploader_asset(ag,'ag') }}"
                            class="inline-block mt-2 px-4 py-2 bg-red-500 text-white font-semibold rounded-lg shadow-md hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 transition ease-in-out duration-150"
                        >
                            <i class="fas fa-file-download mr-2"></i> {{ 'ag.view_document_link'|trans }}
                        </a>
                    </div>
                {% endfor %}
            </div>
        </section>
    </div>
{% endblock %}