111 lines
6.5 KiB
PHP
111 lines
6.5 KiB
PHP
@php
|
|
$blockType = data_get($reduction, 'block_type.value');
|
|
$position = data_get($reduction, 'position.value');
|
|
$ctaUrl = data_get($reduction, 'cta_url.value');
|
|
$ctaLabel = data_get($reduction, 'cta_label.value');
|
|
$articleId = data_get($reduction, 'article_id.value');
|
|
$reductionNews = $articleId ? \App\Models\News::find($articleId) : null;
|
|
$visibility = data_get($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>
|
|
@if ($collection->isNotEmpty())
|
|
<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>
|
|
@endif
|
|
</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>
|