ldc-legaulois/resources/views/fo/partials/commitments/visual-with-cards.blade.php

109 lines
6.3 KiB
PHP

@php
$blockType = $reduction->block_type->value;
$position = $reduction->position->value;
$ctaUrl = $reduction->cta_url->value ?? null;
$ctaLabel = $reduction->cta_label->value ?? null;
$articleId = $reduction->article_id->value ?? null;
$reductionNews = $articleId ? \App\Models\News::find($articleId) : null;
$visibility = $reduction->visibility->value ?? true;
@endphp
<section class="position-relative" id="commitments-visual-with-cards">
<div class="line-border-large bg-tertiary pb-5">
<div class="d-flex flex-column flex-md-row justify-content-center justify-content-evenly align-items-start container pb-4 pt-5">
<div class="row justify-content-evenly align-items-start gx-5">
<div class="col-12 mb-3">
<h2>{{ $title }}</h2>
</div>
<div class="col-12 col-md-5">
<div class="bottom-left-shadow mb-3">
<div class="line-border-small bg-white w-fit p-2">
<img class="line-border-small img-fluid" src="{{ asset($picture) }}"
title="{{ $picture_title }}" alt="{{ $picture_alt }}">
</div>
</div>
<div class="bottom-left-shadow mb-3">
<div class="line-border-small bg-white p-3">
{!! clean($text) !!}
</div>
</div>
</div>
<div class="col-12 col-md-7">
<div class="row w-100 gx-5 mx-auto">
<div class="col-12">
{!! clean($subtext) !!}
</div>
<div class="col-12">
<div class="row w-100 mx-auto">
<div class="col-12 col-md-6">
@foreach ($collection->slice(0, 2) as $item)
<div class="custom-card bottom-left-shadow position-relative my-4">
<div
class="position-absolute d-flex justify-content-between align-items-center w-100 z-1">
<p class="h6 bg-secondary rotate-left m-0 p-2 text-white">
{{ $item['title'] }}</p>
<img class="img-fluid" src="{{ asset($item['picture']['value']) }}"
title="{{ $item['picture']['title'] }}"
alt="{{ $item['picture']['alt'] }}">
</div>
<div class="line-border-small bg-white p-3 pt-5">
{!! clean($item['description']) !!}
</div>
</div>
@endforeach
</div>
<div class="col-12 col-md-6">
@foreach ($collection->slice(2, 2) as $item)
<div class="custom-card bottom-left-shadow position-relative my-4">
<div
class="position-absolute d-flex justify-content-between align-items-center w-100 z-1">
<p class="h6 bg-secondary rotate-left m-0 p-2 text-white">
{{ $item['title'] }}</p>
<img class="img-fluid" src="{{ asset($item['picture']['value']) }}"
title="{{ $item['picture']['title'] }}"
alt="{{ $item['picture']['alt'] }}">
</div>
<div class="line-border-small bg-white p-3 pt-5">
{!! clean($item['description']) !!}
</div>
</div>
@endforeach
</div>
<div class="col-12">
<div class="custom-card bottom-left-shadow position-relative">
<div class="position-absolute z-1 w-fit">
<p class="h6 bg-secondary rotate-left m-0 p-2 text-white">
{{ $collection->last()['title'] }}</p>
</div>
<div
class="line-border-small d-flex justify-content-between align-items-center bg-white p-3">
<img class="img-fluid"
src="{{ asset($collection->last()['picture']['value']) }}"
title="{{ $collection->last()['picture']['title'] }}"
alt="{{ $collection->last()['picture']['alt'] }}">
<div class="ms-2">
{!! clean($collection->last()['description']) !!}
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@if ($visibility)
<div class="container">
@include('fo.partials.block.reduction-card', [
'news' => $reductionNews,
'ctaUrl' => $ctaUrl ?? null,
'ctaLabel' => $ctaLabel ?? null,
'position' => $position,
'blockType' => $blockType,
])
</div>
@endif
</div>
</section>