485 lines
29 KiB
PHP
485 lines
29 KiB
PHP
@extends('fo.layout')
|
|
|
|
@section('title', $staticPageModel->seo_title)
|
|
@section('description', $staticPageModel->seo_description)
|
|
@section('breadcrumb', request()->route()->getName())
|
|
|
|
@section('banner')
|
|
@include('fo.layouts.banner', [
|
|
'h1' => __($staticPageModel->title),
|
|
'asset' => asset($staticPageModel->picture),
|
|
'title' => __($staticPageModel->picture_title),
|
|
'alt' => __($staticPageModel->picture_alt),
|
|
'displayArrow' => true,
|
|
'buttonLink' => '#introduction',
|
|
])
|
|
@endsection
|
|
|
|
@section('content')
|
|
<section class="commit">
|
|
{{-- AMBITION --}}
|
|
<section class="ambition anchor-padding container my-4" id="introduction">
|
|
<div class="commit-navigation z-2">
|
|
<div class="commit-navigation-wrapper show row m-0 p-0">
|
|
{{-- blade-formatter-disable --}}
|
|
@php
|
|
$commitNav = [
|
|
['label' => __('Élever durablement'), 'link' => '#breeding', 'color' => 'tertiary'],
|
|
['label' => __('Mieux vivre'), 'link' => '#life', 'color' => 'quad'],
|
|
['label' => __('Respecter la terre'), 'link' => '#earth', 'color' => 'quint'],
|
|
['label' => __('Bien nourrir'), 'link' => '#feed', 'color' => 'sixt']];
|
|
@endphp
|
|
{{-- blade-formatter-enable --}}
|
|
@foreach ($commitNav as $key => $value)
|
|
<div class="col-6 col-md-12 px-md-0 py-md-1 p-2">
|
|
<div class="rounded-5 bg-{{ $value['color'] }}-light shadow-sm">
|
|
<a class="d-flex justify-content-center align-items-center text-primary text-decoration-none p-sm-3 p-2"
|
|
data-bs-toggle="tooltip" href="{{ $value['link'] }}"
|
|
title="{{ __('Accéder à la partie :name de la page', ['name' => $value['label']]) }}">
|
|
<span class="badge rounded-pill bg-{{ $value['color'] }} d-block me-2"></span>
|
|
<small>{{ $value['label'] }}</small>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
<button class="d-none d-md-block btn btn-primary rounded-pill mt-1 w-fit px-3"
|
|
title="{{ __('Afficher/Masquer le menu des ancres') }}">
|
|
<i class="fa-solid fa-plus d-none"></i>
|
|
<i class="fa-solid fa-minus"></i>
|
|
</button>
|
|
</div>
|
|
<div class="row mt-3">
|
|
<div class="col-12">
|
|
<h2 class="h2 fw-bold text-primary text-center">{{ $ambitionSection->h2_title }}</h2>
|
|
@if ($ambitionSection->text)
|
|
<div class="ck-content text-primary">
|
|
{!! clean($ambitionSection->text) !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{{-- BREEDING --}}
|
|
<section class="breeding border-top-curved-tertiary anchor-padding mt-4" id="breeding">
|
|
<div class="text-bg-tertiary">
|
|
<div class="breeding-wrapper position-relative container">
|
|
<div class="row text-center">
|
|
<div class="col-12 col-lg-8 mx-lg-auto">
|
|
<h2 class="h2 fw-bold">{{ $breedingSection->h2_title }}</h2>
|
|
@if ($breedingSection->text)
|
|
<div class="ck-content w-100 w-md-75 mx-auto">
|
|
{!! clean($breedingSection->text) !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
<div class="row mt-4">
|
|
<div class="col-6 col-md-8 mx-md-auto">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'tertiary',
|
|
'value' => sprintf('%d%%', $breedingSection->data['bloc_key_nombre']['value']),
|
|
'text' => clean($breedingSection->data['bloc_text_accompagnant_le_nombre_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
<div
|
|
class="col-6 col-md-8 mx-md-auto d-flex flex-column justify-content-center text-md-center overflow-hidden text-start">
|
|
{!! clean($breedingSection->data['bloc_images_content']['value']) !!}
|
|
@if ($breedingSection->data['bloc_button_on_temoigne_engagements']['value'])
|
|
<a class="btn btn-primary rounded-pill mx-md-auto w-fit"
|
|
href="{{ route('fo.hire.show') }}#we-testimonials">{{ __('On témoigne') }}</a>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
<div class="breeding-image row position-absolute start-50 translate-middle-x">
|
|
<div class="col-12 mt-4 text-center">
|
|
<img src="{{ Vite::asset('resources/assets/images/commitments/breeding.png') }}"
|
|
title="{{ __('Illustration de l\'engagement \'Elever durablement\'') }}"
|
|
alt="{{ __('Illustration représentant un éleveur et ses volailles') }}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="border-bottom-curved-tertiary w-100"></div>
|
|
<div class="breeding-light bg-tertiary-light">
|
|
<div class="container">
|
|
<div class="row flex-column align-items-center justify-content-center">
|
|
<div class="col-12">
|
|
<h2 class="h2 fw-bold text-primary text-center">{{ __('Faîtes vous votre avis vous-même') }}</h2>
|
|
</div>
|
|
<div class="col-12 col-sm-4">
|
|
<a href="https://www.youtube.com/channel/UCiOgBdc7eaU5vp4VPEk4s8w" target="_blank">
|
|
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/others/logo_nature_eleveurs.png') }}"
|
|
alt="{{ __('Logo Nature d\'éleveurs') }}">
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{{-- LIFE --}}
|
|
<section class="life border-top-curved-upper-tertiary-light anchor-padding mb-4 overflow-hidden" id="life">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12 col-md-8 mx-auto mb-3">
|
|
<div class="d-flex flex-column align-items-center">
|
|
<h2 class="h2 fw-bold text-quad text-center">{{ $lifeSection->h2_title }}</h2>
|
|
<img class="w-fit" src="{{ Vite::asset('resources/assets/images/commitments/life.png') }}"
|
|
title="{{ __('Illustration de l\'engagement \'Mieux vivre\'') }}"
|
|
alt="{{ __('Illustration représentant la communacation dasn un groupe') }}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row justify-content-md-between align-items-center">
|
|
<div class="col-12 col-md-8 py-md-0 mx-auto pb-3">
|
|
@if ($lifeSection->text)
|
|
<div class="ck-content text-primary">
|
|
{!! clean($lifeSection->text) !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<div class="col-12 col-sm-6">
|
|
<div class="mx-sm-0 ms-sm-auto mx-auto w-fit">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'quad',
|
|
'value' => sprintf('%d%%', $lifeSection->data['bloc_key_nombre_n1']['value']),
|
|
'text' => clean($lifeSection->data['bloc_text_accompagnant_le_nombre_n1_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-sm-6">
|
|
<div class="mx-sm-0 me-sm-auto mx-auto w-fit">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'quad',
|
|
'value' => sprintf('%d%%', $lifeSection->data['bloc_key_nombre_n2']['value']),
|
|
'text' => clean($lifeSection->data['bloc_text_accompagnant_le_nombre_n2_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@if ($lifeSection->data['bloc_button_on_temoigne_engagements']['value'])
|
|
<div class="col-12 my-3 text-center">
|
|
<a class="btn btn-primary rounded-pill" data-bs-toggle="tooltip" href="#testimonials"
|
|
title="{{ __('Accéder à la partie des témoignages') }}">{{ __('On témoigne') }}</a>
|
|
</div>
|
|
@endif
|
|
<div class="col-12">
|
|
<div class="ck-content text-primary">
|
|
{!! clean($lifeSection->data['bloc_numero2_content']['value']) !!}
|
|
</div>
|
|
</div>
|
|
<div class="col-12 position-relative mb-5">
|
|
<div class="swiper swiper-commitments-life mt-lg-0 mt-5 overflow-visible" id="swiper-commitments-life">
|
|
<div class="swiper-wrapper">
|
|
@foreach ($slideLifeModels as $slide)
|
|
<div class="swiper-slide">
|
|
<div class="card bg-nine rounded-3 text-quad w-fit border-0 p-2">
|
|
<div class="card-body p-0">
|
|
<img class="img-fluid" src="{{ asset($slide->picture) }}" title="{{ $slide->picture_title }}"
|
|
alt="{{ $slide->picture_alt }}">
|
|
</div>
|
|
<div class="card-footer bg-transparent">
|
|
<p class="m-0 text-center">{{ $slide->title }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
<button class="swiper-button swiper-button-prev-custom swiper-commitments-life-button-prev z-1 mx-3">
|
|
<img src="{{ Vite::asset('resources/assets/images/misc/blue-arrow.svg') }}"
|
|
title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
|
|
</button>
|
|
<button class="swiper-button swiper-button-next-custom swiper-commitments-life-button-next z-1 mx-3">
|
|
<img src="{{ Vite::asset('resources/assets/images/misc/blue-arrow.svg') }}"
|
|
title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
|
|
</button>
|
|
</div>
|
|
@if ($lifeSection->data['bloc_button_on_bouge']['value'])
|
|
<div class="col-12 text-center">
|
|
<a class="btn btn-primary rounded-pill" data-bs-toggle="tooltip" href="{{ route('fo.news.index') }}"
|
|
title="{{ __('Accéder à la page On bouge ensemble') }}">{{ __('On bouge ensemble') }}</a>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</section>
|
|
{{-- EARTH --}}
|
|
<section class="earth border-top-curved-quint anchor-padding mt-4" id="earth">
|
|
<div class="position-relative text-bg-quint">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12 col-md-8 mx-auto">
|
|
<h2 class="h2 fw-bold text-center">{{ $earthSection->h2_title }}</h2>
|
|
</div>
|
|
</div>
|
|
<div class="row justify-content-md-between align-items-center">
|
|
<div class="col-12 col-md-8 py-md-0 mx-auto pb-3">
|
|
@if ($earthSection->text)
|
|
<div class="ck-content">
|
|
{!! clean($earthSection->text) !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<div class="col-12 col-sm-6">
|
|
<div class="mx-sm-0 ms-sm-auto mx-auto w-fit">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'quint',
|
|
'value' => sprintf('%d%%', $earthSection->data['bloc_key_nombre_n1']['value']),
|
|
'text' => clean($earthSection->data['bloc_text_accompagnant_le_nombre_n1_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-sm-6">
|
|
<div class="mx-sm-0 me-sm-auto mx-auto w-fit">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'quint',
|
|
'value' => sprintf('%d%%', $earthSection->data['bloc_key_nombre_n2']['value']),
|
|
'text' => clean($earthSection->data['bloc_text_accompagnant_le_nombre_n2_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@if ($earthSection->data['bloc_button_on_temoigne_engagements']['value'])
|
|
<div class="row pt-4">
|
|
<div class="col-12 text-center">
|
|
<a class="btn btn-primary rounded-pill"
|
|
href="{{ route('fo.hire.show') }}#we-testimonials">{{ __('On témoigne') }}</a>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
<div class="earth-image row position-absolute start-50 translate-middle-x pt-4">
|
|
<div class="col-12">
|
|
<img src="{{ Vite::asset('resources/assets/images/commitments/earth.png') }}"
|
|
title="{{ __('Illustration de l\'engagement \'Respecter la terre\'') }}"
|
|
alt="{{ __('Illustration représentant la nature avec des arbres et des champs') }}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="earth-light border-top-concave-quint bg-quint-light overflow-hidden pb-5">
|
|
<div class="container mt-5">
|
|
<div class="row justify-content-center">
|
|
<div class="col-12 position-relative mb-5">
|
|
<div class="swiper swiper-commitments-earth mt-lg-0 mt-5 overflow-visible" id="swiper-commitments-earth">
|
|
<div class="swiper-wrapper">
|
|
@foreach ($slideEarthModels as $slide)
|
|
<div class="swiper-slide">
|
|
<div class="card bg-quint rounded-3 w-fit border-0 p-2 text-white">
|
|
<div class="card-body p-0">
|
|
<img class="img-fluid" src="{{ asset($slide->picture) }}"
|
|
title="{{ $slide->picture_title }}" alt="{{ $slide->picture_alt }}">
|
|
</div>
|
|
<div class="card-footer bg-transparent">
|
|
<p class="m-0 text-center">{{ $slide->title }}</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
<button class="swiper-button swiper-button-prev-custom swiper-commitments-earth-button-prev z-1 mx-3">
|
|
<img src="{{ Vite::asset('resources/assets/images/misc/blue-arrow.svg') }}"
|
|
title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
|
|
</button>
|
|
<button class="swiper-button swiper-button-next-custom swiper-commitments-earth-button-next z-1 mx-3">
|
|
<img src="{{ Vite::asset('resources/assets/images/misc/blue-arrow.svg') }}"
|
|
title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
|
|
</button>
|
|
</div>
|
|
<div class="col-12 col-md-6 mt-md-0 mt-5">
|
|
<div class="card">
|
|
<div class="card-body">
|
|
<div class="row align-items-center">
|
|
<div class="col-3">
|
|
<img class="w-100" src="{{ asset($earthSection->data['bloc_image']['value']) }}"
|
|
title="{{ $earthSection->data['bloc_image']['title'] }}"
|
|
alt="{{ $earthSection->data['bloc_image']['alt'] }}">
|
|
</div>
|
|
<div class="col-9">
|
|
<div class="ck-content text-quint">
|
|
{!! clean($earthSection->data['bloc_numero2_content']['value']) !!}
|
|
</div>
|
|
<div class="text-start">
|
|
<a class="btn btn-primary rounded-pill mb-0 mb-3 mt-3 text-inherit"
|
|
href="{{ $earthSection->data['bloc_link']['value'] }}"
|
|
target="_blank">{{ __('En savoir plus sur BREEAM') }}</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
{{-- FEED --}}
|
|
<section class="feed anchor-padding mb-4" id="feed">
|
|
<div class="border-top-curved-white bg-quint-light"></div>
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12 col-md-8 mx-auto">
|
|
<div class="d-flex flex-column align-items-center">
|
|
<h2 class="h2 fw-bold text-sixt text-center">{{ $feedSection->h2_title }}</h2>
|
|
<img class="my-3" src="{{ Vite::asset('resources/assets/images/commitments/feed.png') }}"
|
|
title="{{ __('Illustration de l\'engagement \'Bien nourrir\'') }}"
|
|
alt="{{ __('Illustration d\'une femme et d\'un enfant mangeant un délicieux repas') }}">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row justify-content-md-between align-items-center">
|
|
<div class="col-12 col-md-8 py-md-0 mx-auto pb-3">
|
|
@if ($feedSection->text)
|
|
<div class="ck-content text-primary">
|
|
{!! clean($feedSection->text) !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
<div class="col-12 col-sm-6">
|
|
<div class="mx-sm-0 ms-sm-auto mx-auto w-fit">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'sixt',
|
|
'value' => sprintf('%d%%', $feedSection->data['bloc_key_nombre_n1']['value']),
|
|
'text' => clean($feedSection->data['bloc_text_accompagnant_le_nombre_n1_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
</div>
|
|
<div class="col-12 col-sm-6">
|
|
<div class="mx-sm-0 me-sm-auto mx-auto w-fit">
|
|
@include('fo.partials.key-number', [
|
|
'color' => 'sixt',
|
|
'value' => sprintf('%d%%', $feedSection->data['bloc_key_nombre_n2']['value']),
|
|
'text' => clean($feedSection->data['bloc_text_accompagnant_le_nombre_n2_content']['value']),
|
|
'wysiwyg' => true,
|
|
'position' => 'top',
|
|
])
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@if ($feedSection->data['bloc_button_on_temoigne_engagements']['value'])
|
|
<div class="row mb-4 mt-3">
|
|
<div class="col-12 d-flex justify-content-center">
|
|
<a class="btn btn-primary rounded-pill"
|
|
href="{{ route('fo.hire.show') }}#we-testimonials">{{ __('On témoigne') }}</a>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
<div class="row">
|
|
<div class="col-12 col-md-8 mx-auto">
|
|
<div class="ck-content text-primary">
|
|
{!! clean($feedSection->data['bloc_numero2_content']['value']) !!}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="row">
|
|
<div class="col-12 col-md-8 mx-auto">
|
|
<div class="ck-content text-primary">
|
|
{!! clean($feedSection->data['bloc_numero3_content']['value']) !!}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
@if ($feedSection->data['bloc_button_on_produit']['value'])
|
|
<div class="row">
|
|
<div class="col-12 d-flex justify-content-center mt-3">
|
|
<a class="btn btn-primary rounded-pill" href="{{ route('fo.produce.show') }}">{{ __('On produit') }}</a>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</section>
|
|
{{-- TESTIMONIALS --}}
|
|
<section class="border-top-curved-tertiary-light testimonials anchor-padding mt-4" id="testimonials">
|
|
<div class="bg-primary-light">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-12">
|
|
<h2 class="h2 fw-bold text-primary text-center">{{ $testimonialsSection->h2_title }}</h2>
|
|
<h3 class="fs-5 fw-semibold text-primary mb-3">
|
|
{{ $testimonialsSection->data['bloc_string_titre_h3_de_la_section_numero1']['value'] }}
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{-- SLIDER TESTIMONIALS --}}
|
|
<div class="position-relative testimonials-content mask-white-right overflow-hidden">
|
|
<div class="container">
|
|
<div class="row align-items-center">
|
|
<div class="col-12 position-relative mb-5">
|
|
<div class="swiper swiper-commitments-testimonials mt-lg-0 mt-5 h-fit overflow-visible"
|
|
id="swiper-commitments-testimonials">
|
|
<div class="swiper-wrapper h-fit">
|
|
@foreach ($testimonialModels as $testimonial)
|
|
<div class="swiper-slide h-auto">
|
|
@include('fo.partials.testimonials.card', [
|
|
'picture' => [
|
|
'path' => $testimonial->picture,
|
|
'alt' => $testimonial->picture_alt,
|
|
'title' => $testimonial->picture_title,
|
|
],
|
|
'job' => $testimonial->job,
|
|
'name' => $testimonial->name,
|
|
'speach' => $testimonial->content,
|
|
'bgClass' => 'bg-' . $testimonial->type->color(),
|
|
'jobClass' => 'text-white',
|
|
'nameClass' => 'text-white',
|
|
'speachClass' => 'text-white',
|
|
])
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
<button class="swiper-button swiper-button-prev-custom swiper-commitments-testimonials-button-prev z-1 mx-3">
|
|
<img src="{{ Vite::asset('resources/assets/images/misc/blue-arrow.svg') }}"
|
|
title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
|
|
</button>
|
|
<button class="swiper-button swiper-button-next-custom swiper-commitments-testimonials-button-next z-1 mx-3">
|
|
<img src="{{ Vite::asset('resources/assets/images/misc/blue-arrow.svg') }}"
|
|
title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container">
|
|
<div class="row mb-4">
|
|
<div class="col-12">
|
|
<h3 class="fs-5 fw-semibold text-primary my-3 text-center">
|
|
{{ $testimonialsSection->data['bloc_string_titre_h3_de_la_section_numero2']['value'] }}
|
|
</h3>
|
|
@if ($testimonialsSection->text)
|
|
<div class="ck-content text-primary">
|
|
{!! clean($testimonialsSection->text) !!}
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
<div class="row flex-column align-items-center justify-content-center">
|
|
<div class="col-3 col-md-2 col-lg-1 mb-4 text-center">
|
|
<a href="https://www.ldc.fr" target="_blank">
|
|
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/others/logo-ldc.png') }}"
|
|
title="{{ __('Accédez au site www.ldc.fr') }}" alt="{{ __('Logo LDC') }}">
|
|
</a>
|
|
</div>
|
|
<div class="col d-flex flex-column justify-content-center mx-auto mb-4 overflow-hidden text-center">
|
|
<a class="btn btn-white rounded-pill mx-auto w-fit" href="{{ $testimonialsSection->data['bloc_link']['value'] }}"
|
|
@if ($testimonialsSection->data['bloc_link_new_tab']['value']) target="_blank" @endif>{{ __('Lire le rapport') }}</a>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</section>
|
|
@endsection
|