{% extends 'layouts/base.twig' %}

{% block content %}
    <h1 class="my-5 position-relative fs-3 fw-bold sp-module-title">{{ __('Opinión', 'Sindikatua') }}</h1>

    <section class="section-opinion">
        
        {% if posts_opinion %}
            {% for noticias in posts_opinion %}
            {% set imagen = noticias.thumbnail.src | default(imagen_default) %}
            {% set alt = noticias.thumbnail.alt | default('Imagen por defecto') %}

                <div class="card my-3 position-relative posts-noticias">
                    <div class="row g-0">
                        <div class="col-md-4 ">
                            <a href="{{ noticias.link }}" title="{{ noticias.title }}">
                            <img src="{{ imagen }}" alt="{{ alt }}"
                                    class="rounded-start object-fit-cover w-100 h-100 img-noticias"
                                    />
                            </a>
                        </div>
                        <div class="col-md-8">
                            <div class="card-body" style="padding-bottom: 60px;">
                                <a href="{{ noticias.link }}" title="{{ noticias.title }}" class="text-decoration-none card-title">
                                    <h2 class="fw-bolder fs-4 hover-title-text">{{ noticias.title }}</h2>
                                </a>
                                <p class="card-text"> {{
                                        noticias.excerpt({
                                            words: 50,
                                            read_more: ''
                                        })
                                    }}</p>
                                <p class="card-text"><small class="text-body-secondary">{{ noticias.date }}</small></p>
                                <a href="{{ noticias.link  }}" 
                                        class="btn position-absolute btn-secondary-cnt"
                                        style="bottom: 15px; right: 15px; z-index: 10;" 
                                        >
                                        {{ __('Sigue leyendo', 'Sindikatua') }}...
                                        
                                        </a>
                            </div>
                        </div>
                    </div>
                </div>

            {% endfor %}
        {% else %}
            <h2>no hay artículos</h2>
        {% endif %}


        <!-- PAGINATION -->
        {% set pagination = posts_opinion.pagination %}
        <div class="pagination-custom mt-5">
            {% include 'partials/pagination-custom.twig' %}
        </div>

    </section>

{% endblock %}