{% extends 'base.html.twig' %}

{% block page_title %}
    {{- _page.title.value -}}
{% endblock %}

{% block body %}
    <div class="col-12">
        <div class="body">
            <div class="body-content">
                {{- _page.content.value|murph_url|markdown('post') -}}
            </div>
        </div>
    </div>

     <div class="grid grid-flow-row-dens grid-cols-12 md:p-8 gap-5">
         {% for project in projects %}
             <div class="card shadow-md col-span-12 md:col-span-6 lg:col-span-4 m-3 bg-box">
                {% if project.image %}
                    <figure>
                        <img src="{{ asset(project.image)|imagine_filter('project_preview_filter') }}" alt="{{ project.label }}">
                    </figure>
                {% endif %}
                <div class="card-body">
                    <h2 class="card-title">{{ project.label }}</h2>

                    {{- project.description|murph_url|markdown('post') -}}

                    <div class="card-actions mt-5">
                        {% for link in project.links %}
                            <a class="btn btn-xs" href="{{ link.url|murph_url }}" target="_blank">
                                {{- link.label -}}
                            </a>
                        {% endfor %}
                     </div>
                 </div>
            </div>
        {% endfor %}
    </div>
{% endblock %}