Merge branch 'issue-20' into 'develop'
Issue 20 See merge request ldc-web/projets/lionor!19
This commit is contained in:
Vincent BRIDIER
commit
fd1b655fed
2 changed files with 130 additions and 100 deletions
|
|
@ -1,23 +1,25 @@
|
|||
@extends('fo.layout')
|
||||
|
||||
@section('title', __($productModel->name))
|
||||
@section('description', __('Description de la fiche produit'))
|
||||
@section('title', __($productModel->seo_title))
|
||||
@section('description', $productModel->seo_description)
|
||||
|
||||
@section('canonical', route('products.show', ['publishedProduct' => $productModel]))
|
||||
@section('ogPicture', asset($productModel->picture))
|
||||
|
||||
@section('breadcrumb', request()->route()->getName())
|
||||
@section('breadcrumb',
|
||||
request()->route()->getName())
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="g-0 pb-md-5 position-relative hero">
|
||||
<div class="position-relative hero-fix-height">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Panoramique3.jpg') }}" alt="Une assiette de merguez de volailles accompagnées de tomates cerise coupées, d'oigons tranchés et de persil" class="img-fluid">
|
||||
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/Panoramique3.jpg') }}"
|
||||
alt="Une assiette de merguez de volailles accompagnées de tomates cerise coupées, d'oigons tranchés et de persil">
|
||||
</div>
|
||||
<!-- breadcrumb -->
|
||||
<div class="container breadcrumb-obj small mt-3">
|
||||
<div class="breadcrumb-obj small container mt-3">
|
||||
<div class="row">
|
||||
<div class="col-12 d-flex ">
|
||||
<div class="col-12 d-flex">
|
||||
<p class="fst-italic me-2">Vous êtes ici</p>
|
||||
@include('modules/breadcrumb/breadcrumb-body', ['brParam' => $productModel])
|
||||
</div>
|
||||
|
|
@ -26,27 +28,29 @@
|
|||
<!-- END breadcrumb -->
|
||||
</div>
|
||||
|
||||
<div class="container-fluid pt-5 position-relative bckg-illustration bckg-illustration--poulet2">
|
||||
<div class="container-fluid position-relative bckg-illustration bckg-illustration--poulet2 pt-5">
|
||||
<!-- GRID -->
|
||||
<div class="row">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<div class="container">
|
||||
<div class="row g-5">
|
||||
<div class="col-md-6">
|
||||
<img src="{{ asset( $productModel->picture ) }}" alt="{{ $productModel->picture_alt }}" title="{{ $productModel->picture_title }}" class="img-fluid img-cut">
|
||||
<img class="img-fluid img-cut" src="{{ asset($productModel->picture) }}"
|
||||
title="{{ $productModel->picture_title }}" alt="{{ $productModel->picture_alt }}">
|
||||
<div class="container mt-4">
|
||||
<div class="row img-80">
|
||||
@if (isset($productModel->info_cooking))
|
||||
<div class="col-lg-6 d-flex align-items-center">
|
||||
<img src="{{ Vite::asset($productModel->cooking_mode->sticker()) }}" alt="Mode de cuisson">
|
||||
<p class="fw-bold small ms-2 mb-0">{{ $productModel->info_cooking }}</p>
|
||||
</div>
|
||||
<div class="col-lg-6 d-flex align-items-center">
|
||||
<img src="{{ Vite::asset($productModel->cooking_mode->sticker()) }}" alt="Mode de cuisson">
|
||||
<p class="fw-bold small mb-0 ms-2">{{ $productModel->info_cooking }}</p>
|
||||
</div>
|
||||
@endif
|
||||
@if ($productModel->info_consumption)
|
||||
<div class="col-lg-6 d-flex align-items-center">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Poulet.svg') }}" alt="Information de consommation">
|
||||
<p class="fw-bold small ms-2 mb-0">{{ $productModel->info_consumption }}</p>
|
||||
</div>
|
||||
<div class="col-lg-6 d-flex align-items-center">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Poulet.svg') }}"
|
||||
alt="Information de consommation">
|
||||
<p class="fw-bold small mb-0 ms-2">{{ $productModel->info_consumption }}</p>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -57,22 +61,23 @@
|
|||
|
||||
<div class="grey">
|
||||
@if (isset($productModel->preparation))
|
||||
<p class="text-uppercase fw-bold small section">{{ __('Mode de préparation') }}</p>
|
||||
<p>{!! clean($productModel->preparation) !!}</p>
|
||||
<p class="text-uppercase fw-bold small section">{{ __('Mode de préparation') }}</p>
|
||||
<p>{!! clean($productModel->preparation) !!}</p>
|
||||
@endif
|
||||
|
||||
@if (isset($certifications) and $certifications->count() > 0)
|
||||
<p class="text-uppercase fw-bold small section">{{ __('Certifications') }}</p>
|
||||
<p class="text-uppercase fw-bold small section">{{ __('Certifications') }}</p>
|
||||
|
||||
<div class="certifications">
|
||||
<ul class="certifications-list d-flex align-items-center">
|
||||
@foreach ($certifications as $certif)
|
||||
<li class="certification-item mx-1">
|
||||
<img src="{{ asset($certif->sticker) }}" alt="{{ $certif->sticker_alt }}" title="{{ $certif->sticker_title }}">
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
<div class="certifications">
|
||||
<ul class="certifications-list d-flex align-items-center">
|
||||
@foreach ($certifications as $certif)
|
||||
<li class="certification-item mx-1">
|
||||
<img src="{{ asset($certif->sticker) }}" title="{{ $certif->sticker_title }}"
|
||||
alt="{{ $certif->sticker_alt }}">
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<p class="text-uppercase fw-bold small section">{{ __('Ingrédients') }}</p>
|
||||
|
|
@ -80,17 +85,18 @@
|
|||
|
||||
<p class="text-uppercase fw-bold small section">{{ __('Valeurs nutritionnelles') }}</p>
|
||||
<!-- Nutriscore : nous afficherons des images (pictos standards nutriscore de A à E) en fonction d'une valeur Alpha venant de la base de donnée et gérée en back office. Donc, pour l'intégration il s'agit d'afficher une image de nutriscore. -->
|
||||
@if($productModel->nutriscore->value > 1)
|
||||
<img src="{{ Vite::asset($productModel->nutriscore->sticker()) }}" alt="Logo du nutriscore" class="img-150">
|
||||
@if ($productModel->nutriscore->value > 1)
|
||||
<img class="img-150" src="{{ Vite::asset($productModel->nutriscore->sticker()) }}"
|
||||
alt="Logo du nutriscore">
|
||||
@endif
|
||||
<!-- Valeurs nutritionnelles : il s'agit de textes dynamiques provenant de là aussi du back office, pour l'intégration on a donc a faire à du contenu HTML -->
|
||||
<table class="nutri-values mt-3">
|
||||
@foreach ($productModel->nutritional_values as $nutri)
|
||||
<tr>
|
||||
<td>{{ $nutri['label'] }}</td>
|
||||
<td></td>
|
||||
<td>{{ $nutri['value'] }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>{{ $nutri['label'] }}</td>
|
||||
<td></td>
|
||||
<td>{{ $nutri['value'] }}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</table>
|
||||
</div>
|
||||
|
|
@ -103,20 +109,23 @@
|
|||
</div>
|
||||
|
||||
<!-- 3 RECETTES -->
|
||||
<div class="container recipes mt-5">
|
||||
<div class="recipes container mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<span class="separator-shadow"></span>
|
||||
<section class="stripes">
|
||||
<h2 class="text-center text-uppercase font-amatic font-amatic-48 special d-sm-inline-flex position-relative">{{ __('Trouver l\'inspiration avec nos recettes') }}<span class="font-amatic-red">{{ __('de volailles bonnes et accessibles') }}</span></h2>
|
||||
<h2 class="text-uppercase font-amatic font-amatic-48 special d-sm-inline-flex position-relative text-center">
|
||||
{{ __('Trouver l\'inspiration avec nos recettes') }}<span
|
||||
class="font-amatic-red">{{ __('de volailles bonnes et accessibles') }}</span></h2>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@include('fo.partials.recipes-block', ['recipes' => $associatedRecipes])
|
||||
|
||||
<p class="text-center mt-3">
|
||||
<a href="{{ route('recipes.index') }}" title="{{ __('Nos recettes') }}" class="btn btn-primary text-uppercase">{{ __('Voir toutes nos recettes >') }}</a>
|
||||
<p class="mt-3 text-center">
|
||||
<a class="btn btn-primary text-uppercase" href="{{ route('recipes.index') }}"
|
||||
title="{{ __('Nos recettes') }}">{{ __('Voir toutes nos recettes >') }}</a>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,23 +1,25 @@
|
|||
@extends('fo.layout')
|
||||
|
||||
@section('title', __($recipeModel->name))
|
||||
@section('description', __('Description de la recette'))
|
||||
@section('title', __($recipeModel->seo_title))
|
||||
@section('description', $recipeModel->seo_description)
|
||||
|
||||
@section('canonical', route('recipes.show', ['publishedRecipe' => $recipeModel]))
|
||||
@section('ogPicture', asset($recipeModel->picture))
|
||||
|
||||
@section('breadcrumb', request()->route()->getName())
|
||||
@section('breadcrumb',
|
||||
request()->route()->getName())
|
||||
|
||||
@section('content')
|
||||
|
||||
<div class="g-0 pb-md-5 position-relative hero">
|
||||
<div class="position-relative hero-fix-height">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Panoramique5.jpg') }}" alt="Un poulet rôti accompagné de carottes et de pommes de terre" class="img-fluid">
|
||||
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/Panoramique5.jpg') }}"
|
||||
alt="Un poulet rôti accompagné de carottes et de pommes de terre">
|
||||
</div>
|
||||
<!-- breadcrumb -->
|
||||
<div class="container breadcrumb-obj small mt-3">
|
||||
<div class="breadcrumb-obj small container mt-3">
|
||||
<div class="row">
|
||||
<div class="col-12 d-flex ">
|
||||
<div class="col-12 d-flex">
|
||||
<p class="fst-italic me-2">Vous êtes ici</p>
|
||||
@include('modules/breadcrumb/breadcrumb-body', ['brParam' => $recipeModel])
|
||||
</div>
|
||||
|
|
@ -29,68 +31,73 @@
|
|||
<div class="container-fluid pt-lg-5 position-relative bckg-illustration bckg-illustration--cuillere">
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="container recipe-wrap">
|
||||
<div class="recipe-wrap container">
|
||||
<!-- DESCRIPTION RECETTE -->
|
||||
<div class="row g-5 mb-5">
|
||||
<div class="col-md-6 cn-youtube">
|
||||
@if ($recipeModel->youtube_video_id)
|
||||
@php
|
||||
$video_value = $recipeModel->youtube_video_id ?? null;
|
||||
@php
|
||||
$video_value = $recipeModel->youtube_video_id ?? null;
|
||||
|
||||
$player = 'UNDEFINED';
|
||||
$link = null;
|
||||
$picture = '/' . $recipeModel->picture;
|
||||
$alt = $recipeModel->picture_alt;
|
||||
$title = $recipeModel->picture_title;
|
||||
$player = 'UNDEFINED';
|
||||
$link = null;
|
||||
$picture = '/' . $recipeModel->picture;
|
||||
$alt = $recipeModel->picture_alt;
|
||||
$title = $recipeModel->picture_title;
|
||||
|
||||
switch (true) {
|
||||
// YOUTUBE
|
||||
case preg_match('%([^"&?\/\s]{11})%i', $recipeModel->youtube_video_id):
|
||||
$player = 'youtube';
|
||||
$link = "https://www.youtube.com/embed/{$video_value}";
|
||||
break;
|
||||
switch (true) {
|
||||
// YOUTUBE
|
||||
case preg_match('%([^"&?\/\s]{11})%i', $recipeModel->youtube_video_id):
|
||||
$player = 'youtube';
|
||||
$link = "https://www.youtube.com/embed/{$video_value}";
|
||||
break;
|
||||
|
||||
// IGNORE
|
||||
case is_null($video_value):
|
||||
break;
|
||||
default:
|
||||
throw new \Error("Unhandled video id {$video_value}");
|
||||
}
|
||||
@endphp
|
||||
@include('fo.modules.video-frame', [
|
||||
'type' => $player,
|
||||
'title' => $title,
|
||||
'link' => $link,
|
||||
'picture' => $picture,
|
||||
'alt' => $alt,
|
||||
])
|
||||
// IGNORE
|
||||
case is_null($video_value):
|
||||
break;
|
||||
default:
|
||||
throw new \Error("Unhandled video id {$video_value}");
|
||||
}
|
||||
@endphp
|
||||
@include('fo.modules.video-frame', [
|
||||
'type' => $player,
|
||||
'title' => $title,
|
||||
'link' => $link,
|
||||
'picture' => $picture,
|
||||
'alt' => $alt,
|
||||
])
|
||||
@else
|
||||
<img class="img-fluid img-cut" src="{{ asset( $recipeModel->picture ) }}" alt="{{ $recipeModel->picture_alt }}" title="{{ $recipeModel->picture_title }}">
|
||||
<img class="img-fluid img-cut" src="{{ asset($recipeModel->picture) }}"
|
||||
title="{{ $recipeModel->picture_title }}" alt="{{ $recipeModel->picture_alt }}">
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<h1 class="font-amatic font-amatic-70 font-amatic-red">{{ $recipeModel->name }}</h1>
|
||||
<p class="section">{!! clean($recipeModel->description) !!}</p>
|
||||
|
||||
<div class="steps text-center text-uppercase">
|
||||
<div class="steps text-uppercase text-center">
|
||||
<ul class="steps-list d-flex align-items-center">
|
||||
<li class="step-item mx-md-2">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Portion.svg') }}" alt="Une illustration de trois assiettes rouges surmontées d'une crète de poulet">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Portion.svg') }}"
|
||||
alt="Une illustration de trois assiettes rouges surmontées d'une crète de poulet">
|
||||
<span class="fw-bold">{{ __('portions') }}</span>
|
||||
<span class="fw-bold">{{ $recipeModel->portions }}</span>
|
||||
</li>
|
||||
<li class="step-item mx-md-2">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Difficulte.svg') }}" alt="Une illustration d'une toque de cuisinier rouge surmontée d'une crète de poulet">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Difficulte.svg') }}"
|
||||
alt="Une illustration d'une toque de cuisinier rouge surmontée d'une crète de poulet">
|
||||
<span class="fw-bold">{{ __('difficulté') }}</span>
|
||||
<span class="fw-bold">{{ $recipeModel->difficulty->label() }}</span>
|
||||
</li>
|
||||
<li class="step-item mx-md-2">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Preparation.svg') }}" alt="Une illustration d'un minuteur en forme d'oeuf rouge surmonté d'une crète de poulet">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Preparation.svg') }}"
|
||||
alt="Une illustration d'un minuteur en forme d'oeuf rouge surmonté d'une crète de poulet">
|
||||
<span class="fw-bold">{{ __('préparation') }}</span>
|
||||
<span class="fw-bold">{{ $recipeModel->preparation_time_label }}</span>
|
||||
</li>
|
||||
<li class="step-item mx-md-2">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Cuisson.svg') }}" alt="Une illustration d'un four rouge surmonté d'une crète de poulet">
|
||||
<img src="{{ Vite::asset('resources/assets/images/Cuisson.svg') }}"
|
||||
alt="Une illustration d'un four rouge surmonté d'une crète de poulet">
|
||||
<span class="fw-bold">{{ __('cuisson') }}</span>
|
||||
<span class="fw-bold">{{ $recipeModel->cooking_time_label }}</span>
|
||||
</li>
|
||||
|
|
@ -104,21 +111,24 @@
|
|||
<div class="col-md-3">
|
||||
<p class="text-uppercase fw-bold section">{{ __('Produit(s) associé(s)') }}</p>
|
||||
@foreach ($products as $product)
|
||||
<div class="text-center mb-3">
|
||||
<img src="{{ asset($product->sticker) }}" alt="{{ $product->sticker_alt }}" title="{{ $product->sticker_title }}" class="img-fluid">
|
||||
<p class="font-amatic font-amatic-46 text-uppercase">{{ $product->name }}</p>
|
||||
<a href="{{ route('products.show', ['publishedProduct' => $product]) }}" title="{{ $product->name }}" class="btn btn-primary text-uppercase">{{ __('Voir le produit >') }}</a>
|
||||
</div>
|
||||
<div class="mb-3 text-center">
|
||||
<img class="img-fluid" src="{{ asset($product->sticker) }}" title="{{ $product->sticker_title }}"
|
||||
alt="{{ $product->sticker_alt }}">
|
||||
<p class="font-amatic font-amatic-46 text-uppercase">{{ $product->name }}</p>
|
||||
<a class="btn btn-primary text-uppercase"
|
||||
href="{{ route('products.show', ['publishedProduct' => $product]) }}"
|
||||
title="{{ $product->name }}">{{ __('Voir le produit >') }}</a>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
<div class="col-md-3">
|
||||
@if (count($recipeModel->ingredients))
|
||||
<p class="text-uppercase fw-bold section">{{ __('Ingrédients') }}</p>
|
||||
<ul class="ingredients">
|
||||
@foreach ($recipeModel->ingredients as $ingredient)
|
||||
<li><strong>{{ $ingredient['value'] }}</strong> {{ $ingredient['label'] }}</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
<p class="text-uppercase fw-bold section">{{ __('Ingrédients') }}</p>
|
||||
<ul class="ingredients">
|
||||
@foreach ($recipeModel->ingredients as $ingredient)
|
||||
<li><strong>{{ $ingredient['value'] }}</strong> {{ $ingredient['label'] }}</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
@endif
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
|
|
@ -127,15 +137,23 @@
|
|||
{!! clean($recipeModel->preparation) !!}
|
||||
</div>
|
||||
<div>
|
||||
<a href="#" title="{{ __('Imprimer la recette') }}" class="btn btn-secondary text-uppercase btn-printing"><i class="fa fa-print me-2"></i>{{ __('Imprimer') }}</a>
|
||||
<a class="btn btn-secondary text-uppercase btn-printing" href="#"
|
||||
title="{{ __('Imprimer la recette') }}"><i class="fa fa-print me-2"></i>{{ __('Imprimer') }}</a>
|
||||
<span class="share position-relative">
|
||||
<button id="shareBtn" class="btn btn-secondary text-uppercase"><i class="fa fa-share-alt me-2"></i>{{ __('Partager') }}</button>
|
||||
<ul class="share-list position-absolute w-100 p-0 pt-4 m-0">
|
||||
<li class="mx-2 flex-grow-1 text-center">
|
||||
@include('modules.social-share', ['socialNetwork' => 'facebook', 'title' => $recipeModel->name])
|
||||
<button class="btn btn-secondary text-uppercase" id="shareBtn"><i
|
||||
class="fa fa-share-alt me-2"></i>{{ __('Partager') }}</button>
|
||||
<ul class="share-list position-absolute w-100 m-0 p-0 pt-4">
|
||||
<li class="flex-grow-1 mx-2 text-center">
|
||||
@include('modules.social-share', [
|
||||
'socialNetwork' => 'facebook',
|
||||
'title' => $recipeModel->name,
|
||||
])
|
||||
</li>
|
||||
<li>
|
||||
@include('modules.social-share', ['socialNetwork' => 'twitter', 'title' => $recipeModel->name])
|
||||
@include('modules.social-share', [
|
||||
'socialNetwork' => 'twitter',
|
||||
'title' => $recipeModel->name,
|
||||
])
|
||||
</li>
|
||||
</ul>
|
||||
</span>
|
||||
|
|
@ -148,12 +166,14 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<section class="container recipes mt-5">
|
||||
<section class="recipes container mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
<span class="separator-shadow"></span>
|
||||
<section class="stripes">
|
||||
<h2 class="text-center text-uppercase font-amatic font-amatic-48 special d-sm-inline-flex position-relative">{{ __('Trouver l\'inspiration avec nos recettes') }}<span class="font-amatic-red">{{ __('de volailles bonnes et accessibles') }}</span></h2>
|
||||
<h2 class="text-uppercase font-amatic font-amatic-48 special d-sm-inline-flex position-relative text-center">
|
||||
{{ __('Trouver l\'inspiration avec nos recettes') }}<span
|
||||
class="font-amatic-red">{{ __('de volailles bonnes et accessibles') }}</span></h2>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -161,8 +181,9 @@
|
|||
<!-- RECETTES -->
|
||||
@include('fo.partials.recipes-block', ['recipes' => $relatedRecipes])
|
||||
|
||||
<p class="text-center mt-3">
|
||||
<a href="{{ route('recipes.index') }}" title="{{ __('Nos recettes') }}" class="btn btn-primary text-uppercase">{{ __('Voir toutes nos recettes >') }}</a>
|
||||
<p class="mt-3 text-center">
|
||||
<a class="btn btn-primary text-uppercase" href="{{ route('recipes.index') }}"
|
||||
title="{{ __('Nos recettes') }}">{{ __('Voir toutes nos recettes >') }}</a>
|
||||
</p>
|
||||
|
||||
</section>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue