fix: 🐛 display the good date for news + improve display header picture

This commit is contained in:
Nicolas Demangeat 2024-09-27 11:50:17 +02:00
parent 983bc664fc
commit df6f4ece2b
6 changed files with 50 additions and 43 deletions

View file

@ -39,7 +39,7 @@
}
@include media-breakpoint-up(xxl) {
right: 12vw;
right: 16vw;
max-width: 45%;
}

View file

@ -17,7 +17,7 @@
{{ $badge->label }}
</div>
@endif
<div class="d-flex justicy-content-center align-items-center">
<div class="d-flex justify-content-center align-items-center">
@if (isset($badge) && !empty($picto))
<img class="img-fluid my-3 me-2" id="header-banner-picto" src="{{ $picto }}" title="{{ $picto_title }}"
alt="{{ $picto_alt }}">

View file

@ -13,7 +13,7 @@
{{ $badge->label }}
</div>
@endif
<div class="d-flex justicy-content-center align-items-center">
<div class="d-flex justify-content-center align-items-center">
@if (isset($badge) && !empty($picto))
<img class="img-fluid my-3 me-2" id="header-banner-picto" src="{{ $picto }}" title="{{ $picto_title }}"
alt="{{ $picto_alt }}">

View file

@ -17,7 +17,7 @@
<div class="col-12 col-xl-6 position-relative z-1">
@include('modules.breadcrumbs.breadcrumb-body', ['brParam' => [$staticPageModel, $newsBreedingModel]])
<hgroup>
<div class="d-flex justicy-content-center align-items-center">
<div class="d-flex justify-content-center align-items-center">
<h1 class="my-3">{{ $newsBreedingModel->title }}</h1>
</div>
<ul class="d-flex justify-content-start align-items-baseline p-0">

View file

@ -10,45 +10,54 @@
{{-- HEADER --}}
<section id="news-header" class="position-relative mb-3 mb-xl-0">
<div id="news-background" class="position-absolute start-0 w-100 h-100 z-0"></div>
<div class="container row w-100 mx-auto pb-5">
<div class="col-12 col-xl-6 col-xxl-8 position-relative z-1">
@include('modules.breadcrumbs.breadcrumb-body', ['brParam' => $newsModel])
<h1 class="my-3 text-break">{{ $newsModel->title }}</h1>
</div>
<div class="col-12 col-md-6 position-relative z-1">
<ul class="d-flex justify-content-start align-items-baseline p-0">
<li class="me-2">
<p class="text-uppercase text-bg-quad f-bourton-base fs-5 px-2 py-1">{{ $newsModel->newsCategory->title }}</p>
</li>
<li class="me-2">
<p class="fs-4 px-2 py-1">{{ str($newsModel->created_at->isoFormat('LL'))->ucFirst() }}</p>
</li>
<li>
@include('fo.partials.button-share', [
'link' => route('fo.news.show', $newsModel->slug),
'elementName' => __('news')
])
</li>
</ul>
</div>
<div class="d-none d-xl-block col-6 col-xxl-4">
<div class="news-image-wrapper">
<img class="img-fluid" src="{{ asset($newsModel->picture) }}"
alt="{{ $newsModel->picture_alt }}" title="{{ $newsModel->picture_title }}">
<div class="container w-100 mx-auto pb-5">
<div class="row">
<div class="col-12 col-xl-6 position-relative z-1">
@include('modules.breadcrumbs.breadcrumb-body', ['brParam' => $newsModel])
<h1 class="my-3 text-break">{{ $newsModel->title }}</h1>
</div>
</div>
<div class="d-xl-none col-12 col-md-8 mx-auto position-relative mt-4 z-1">
<div class="news-image-wrapper">
<img class="img-fluid" src="{{ asset($newsModel->picture) }}"
alt="{{ $newsModel->picture_alt }}" title="{{ $newsModel->picture_title }}">
<div class="row">
<div class="col-12 position-relative z-1">
<ul class="d-flex justify-content-start align-items-baseline p-0">
<li class="me-2">
<p class="text-uppercase text-bg-quad f-bourton-base fs-5 px-2 py-1">{{ $newsModel->newsCategory->title }}</p>
</li>
<li class="me-2">
<p class="fs-4 px-2 py-1">{{ str($newsModel->updated_at->isoFormat('LL'))->ucFirst() }}</p>
</li>
<li>
@include('fo.partials.button-share', [
'link' => route('fo.news.show', $newsModel->slug),
'elementName' => __('news')
])
</li>
</ul>
</div>
</div>
<div class="row">
<div class="d-none d-xl-block col-6 col-xxl-4">
<div class="news-image-wrapper">
<img class="img-fluid" src="{{ asset($newsModel->picture) }}"
alt="{{ $newsModel->picture_alt }}" title="{{ $newsModel->picture_title }}">
</div>
</div>
<div class="d-xl-none col-12 col-md-8 mx-auto position-relative mt-4 z-1">
<div class="news-image-wrapper">
<img class="img-fluid" src="{{ asset($newsModel->picture) }}"
alt="{{ $newsModel->picture_alt }}" title="{{ $newsModel->picture_title }}">
</div>
</div>
</div>
</div>
</section>
{{-- CONTENT --}}
<section class="container mt-3">
<div class="row">
<article class="col me-4">
<h2 class="text-break">{{ $newsModel->subtitle }}</h2>
<h2 class="text-break">
{{ $newsModel->subtitle }}
</h2>
<div class="ck-content">
{!! clean($newsModel->content) !!}
</div>

View file

@ -50,8 +50,8 @@
<img class="img-fluid rotate-right" src="{{ asset($productModel->packaging) }}"
title="{{ $productModel->packaging_title }}" alt="{{ $productModel->packaging_alt }}">
<img class="d-none d-sm-block img-fluid position-absolute bottom-0 start-0"
src="{{ asset($productModel->picture) }}" title="{{ $productModel->picture_title }}"
alt="{{ $productModel->picture_alt }}">
src="{{ asset($productModel->picture) }}" title="{{ $productModel->picture ? $productModel->picture_title : '' }}"
alt="{{ $productModel->picture ? $productModel->picture_alt : '' }}">
</div>
@if (!is_null($nextProductModel) && $productModel->getKey() !== $nextProductModel->getKey())
<a class="product-header-next-mobile d-sm-none position-absolute top-50 translate-middle-y btn btn-white rounded-circle z-1 end-0 me-3"
@ -73,9 +73,7 @@
{{-- PRODUCT LABEL --}}
<div @class([
'col-12',
'col-sm-8 col-lg-12 col-xxl-8' => $productModel->labels->where(
'published',
true),
'col-sm-8 col-lg-12 col-xxl-8' => $productModel->labels->where('published', true),
])>
<h1 class="my-3">{{ $productModel->label }}</h1>
</div>
@ -319,8 +317,8 @@
data-aos-duration="750" data-aos-delay="1250" data-aos-once="true"
data-aos-anchor-placement="bottom-bottom">
<div class="part-left rotate-left">
<img class="img-fluid rotate-right" src="{{ asset($recipeModel->picture) }}"
title="{{ $recipeModel->picture_title }}" alt="{{ $recipeModel->picture_alt }}">
<img class="img-fluid rotate-right" src="{{ asset($recipeModel->consumptionMoment->picture) }}"
title="{{ $recipeModel->consumptionMoment->picture_title }}" alt="{{ $recipeModel->consumptionMoment->picture_alt }}">
<div class="rotate-custom ps-4 pt-5">
<p class="h3 fs-5 text-center">
{{ $staticPageModel->data['animation_text_1']['value'] }}
@ -335,8 +333,8 @@
<img class="img-fluid rotate-right" src="{{ asset($productModel->packaging) }}"
title="{{ $productModel->packaging_title }}" alt="{{ $productModel->packaging_alt }}">
<img class="img-fluid position-absolute w-50 bottom-0 start-0"
src="{{ asset($productModel->picture) }}" title="{{ $productModel->picture_title }}"
alt="{{ $productModel->picture_alt }}">
src="{{ asset($productModel->picture) }}" title="{{ $productModel->picture ? $productModel->picture_title : '' }}"
alt="{{ $productModel->picture ? $productModel->picture_alt : '' }}">
</div>
</div>
@if ($recipeModel)