{% extends "base.html.twig" %}
{% set currentPage = "navbar.posts"|trans %}
{% set h1 = post.h1 %}
{% block metaTags %}
<meta name="description" content="{{ post.metaDescription }}">
<title>{{ post.metaTitle ?? post.title }}</title>
<meta property="og:title" content="{{ post.metaTitle }}">
<meta property="og:description" content="{{ post.metaDescription }}">
<meta property="og:image" content="{{ absolute_url(asset(vich_uploader_asset(post, 'postFile'))) }}">
<meta property="og:url" content="{{ absolute_url(path('front_post', {'slug':post.slug})) }}">
{% endblock %}
{% block body %}
<section class="position-relative pab-100 section-grey pat-70 text-center text-md-left">
<div class="container position-relative zi-9">
{% include "front/menu.html.twig" with {'menu':{("menu.posts"|trans):path("front_posts"), (post.title) : "#"}} %}
<h2 data-aos="fade-up" data-aos-duration="800" class="text-center titleh1 mab-10">{{ post.title }}</h2>
{% if post.postCategory %}
<p data-aos="fade-up" data-aos-duration="800" data-aos-delay="200" class="text-uppercase fw-500 c-9DC771 ls-custom fs-14 mab-55 text-center">{{ post.postCategory.title }}</p>
{% endif %}
<div data-aos="fade-up" data-aos-duration="800" data-aos-delay="400">
<img src="{{ asset(vich_uploader_asset(post, 'postFile')) | imagine_filter('medium') }}"
alt="{{ post.title }}" class="w-100 he-440 img-fit br-8 mab-70"/>
</div>
<div class="container-post mx-auto post-content">
<div class="paragraph" data-aos="fade-in" data-aos-duration="800">{{ post.intro|raw }}</div>
{% for key, paragraph in paragraphs %}
<div class="may-20 paragraph" data-aos="fade-in" data-aos-duration="800" data-aos-delay="200">
{% if paragraph.content %}
{# <div style="{% if paragraph.color %}color:{{ paragraph.color }};{% endif %}"> #}
{{ paragraph.content|raw }}
{% endif %}
{% if paragraph.paragraphFileName %}
<div class="text-center">
<img src="{{ asset(vich_uploader_asset(paragraph, 'paragraphFile')) | imagine_filter('medium') }}"
alt="{% if paragraph.legend %}{{ paragraph.legend }}{% endif %}"
/>
</div>
{% if paragraph.legend %}
<p class="paragraph text-center">{{ paragraph.legend }}</p>
{% endif %}
{% endif %}
</div>
{% endfor %}
<div data-aos="fade-up" data-aos-duration="800" d class="position-relative overflow-hidden br-8 mat-60">
<div class="pointer prev-media-slid bgc-F9FAFE position-absolute he-37 br-50 d-flex align-items-center justify-content-center zi-99 wi-37 l-30 t-0 b-0 my-auto">
<i class="fa-light fa-arrow-left c-204A9A"></i>
</div>
<div class="pointer next-media-slid bgc-F9FAFE position-absolute he-37 wi-37 br-50 d-flex align-items-center justify-content-center zi-99 r-30 t-0 b-0 my-auto">
<i class="fa-light fa-arrow-right c-204A9A"></i>
</div>
<div class="slick-medias position-relative zi-9">
{% for key, postMedia in postMedias %}
{% if postMedia.youtube %}
<div class="position-relative">
<div class="bgc-media"></div>
<div type="button" data-toggle="modal" data-target="#mediaModal{{loop.index}}" class="position-absolute he-70 d-flex align-items-center justify-content-center t-0 r-0 b-0 l-0 m-auto bgc-9DC771 wi-70 br-50" >
<i class="fa-solid fa-play c-white fs-17"></i>
</div>
<img src="{{ asset(vich_uploader_asset(postMedia, 'postMediaFile')) | imagine_filter('medium') }}"
alt="{{ postMedia.title }}" class="br-8 he-440 img-fit w-100"/>
</div>
{% else %}
<div class="position-relative">
<div class="bgc-media h-100 w-100"></div>
<img src="{{ asset(vich_uploader_asset(postMedia, 'postMediaFile')) | imagine_filter('medium') }}"
alt="{{ postMedia.title }}" class="br-8 he-440 img-fit w-100"/>
</div>
{% endif %}
{% endfor %}
</div>
</div>
<div data-aos="fade-right" data-aos-duration="800" class="pat-60 pab-40" id="share"
data-facebook="{{ asset('assets/img/facebook.svg') }}"
data-linkedin="{{ asset('assets/img/linkedin.svg') }}"
data-twitter="{{ asset('assets/img/tweet.svg') }}"
data-pinterest="{{ asset('assets/img/Pinterest.svg') }}"
></div>
<a data-aos="fade-right" data-aos-duration="800" data-aos-delay="200"class="c-9DC771 fw-600 d-flex align-items-center justify-content-center-sm" href="{{path('front_posts')}}"><i class="fa-solid fa-arrow-left mar-10"></i><span>{{"post.return.link"|trans}}</span></a>
</div>
</div>
<img src="{{ asset('assets/img/Motif.png') }}" alt="background motif" class="uexpmv w-100 b-0 l-0 img-fit position-absolute"/>
</section>
<section class="position-relative pat-100 pab-50">
<div class="container position-relative zi-9">
<div data-aos="fade-in" data-aos-duration="800" class="surtitle text-center c-204A9A fs-16 fw-600 text-uppercase ls-custom2">
{{ "post.lastNews.surTitle"|trans }}
</div>
<h2 data-aos="fade-in" data-aos-duration="800" data-aos-delay="200"class="text-center titleh1 mab-10">{{ "post.lastNews.title"|trans }}</h2>
{% include "front/postsList.html.twig" with {'postDetail':1} %}
</div>
<img src="{{ asset('assets/img/Motif.png') }}" alt="background motif" class="uexpmv w-100 b-0 l-0 img-fit position-absolute"/>
</section>
{% for key, postMedia in postMedias %}
{% if postMedia.youtube %}
<div class="modal fade modalVideo" id="mediaModal{{loop.index}}" tabindex="-1" role="dialog"
aria-labelledby="skillYoutubeModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered" role="document">
<div class="modal-content">
<button type="button" class="close may-0 max-0 pa-0 position-absolute bgc-f8fafc c-204A9A o-100 wi-30 fs-16 he-30 t--15 r--15 zi-999 br-20" data-dismiss="modal" aria-label="Close">
<i class="far fa-times" aria-hidden="true"></i>
</button>
<div class="modal-body">
{{ postMedia.youtube|raw }}
</div>
</div>
</div>
</div>
{% endif %}
{% endfor %}
{% endblock %}