forge-joniko/ldc-legaulois
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge branch 'develop' into trunk

Browse source
This commit is contained in:
Vincent BRIDIER 2025-05-09 09:03:29 +02:00
commit 5075d9bb5e
No known key found for this signature in database
GPG key ID: 8571BFA20420D512
9 changed files with 101 additions and 65 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
public/tdf-downloads/Pancarte COULEURS(A4).png
View file

Binary file not shown.
Side by side

Before

Width:  |  Height:  |  Size: 1.6 MiB

BIN
public/tdf-downloads/Pancarte.pdf Normal file
View file

Binary file not shown.

25
resources/sass/fo/pages/page-tdf.scss
View file

@ -3,11 +3,13 @@
min-height: 80vh;
}
.hero-bg {
background-image: url('/resources/assets/images/page-tdf/TDF-hero-bg.jpg');
background-position: center;
background-repeat: no-repeat;
background-size: cover;
@include media-breakpoint-up(md) {
.hero-bg {
background-image: url('/resources/assets/images/page-tdf/TDF-hero-bg.jpg');
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
}
.logo-tdf {
@ -84,8 +86,21 @@
}
}
#le-gaulois-et-le-tour-de-france {
padding-top: 80px;
@include media-breakpoint-up(md) {
padding-top: 100px;
}
}
#au-coeur-de-la-caravane {
padding-top: 80px;
@include media-breakpoint-up(md) {
padding-top: 100px;
}
.anecdote-container {
padding: 80px 0;
}

38
resources/views/components/fo/page-tdf/au-coeur-de-la-caravane.blade.php
View file

@ -4,40 +4,40 @@
'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-soleil-jaune-météo.svg'),
'picto_alt' => 'Pictogramme d\'un soleil pour les anecdoctes météo sur le Tour de France',
'picto_title' => 'Pictogramme d\'un soleil',
'title' => 'La météo : La caravane par tous les temps !',
'title' => 'La caravane par tous les temps !',
'content' =>
'Le 26 juillet 2019, lors de l\'étape entre Saint-Jean-de-Maurienne et Tignes, longue de 126,5 kms avec 156 coureurs au départ, un orage de grêle s\'invite à la fête. Les chars de la caravane parviennent à monter jusqu’à Tignes, mais l’orage apporte une trop grande quantité de grêle, entraînant une coulée de boue qui bloque la route et l’accès aux cyclistes. La décision de l’organisation est inéluctable : l’arrêt de l’étape qui restera dans l’histoire du Tour de France !',
'Le 26 juillet 2019, lors de l\'étape Saint-Jean-de-Maurienne et Tignes, les chars terminent leur parade quand un orage de grêle s\'invite et entraîne une coulée de boue qui bloque la route et l’accès aux cyclistes. L’organisation décide l\'arrêt de l’étape et marquera l’histoire du Tour de France.',
],
[
'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-enfant-brun-famille.svg'),
'picto_alt' => 'Pictogramme d\'une tête d\'enfant pour les liens de parenté au sein de l\'équipe des caravaniers',
'picto_title' => 'Pictogramme d\'un enfant',
'title' => 'Famille : Le Père et le Fils, la transmission d’une passion !',
'title' => 'La transmission d’une passion entre Père & Fils !',
'content' =>
'Grand habitué de la plus grande course cycliste du monde avec plus de 10 tours à son actif, Jean-Marie a transmis sa passion à son fils. Fusionnels dans la vie, Léo assure : « Sur le Tour, nous sommes collègues, mais il y a toujours cette fierté personnelle de partager ces moments ensemble sur les routes de France. ». De quoi se forger déjà une belle complicité !',
],
[
'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-sirène-pompier-rouge.svg'),
'picto_alt' => 'Pictogramme d\'une sirène d\'alarme pour les anecdoctes insolites pendant le Tour de France',
'picto_title' => 'Pictorgramme d\'une alarme',
'title' => 'Histoire de poulet',
'content' =>
'Avec un sens de l’humour aguerri, Cocotte rencontre une sympathique collègue au détour d’un passage dans un village sur les routes du Tour de France. On adore regarder la vidéo <a href="https://www.youtube.com/watch?v=reI-Z8UE3lM" target="_blank">‘Salut collègue’</a> !',
'Avec plus de 10 tours de France à son actif, Jean-Marie a transmis sa passion à son fils. Léo assure : « Sur le Tour, nous sommes collègues, mais il y a toujours cette fierté personnelle de partager ces moments ensemble sur les routes de France. ».',
],
[
'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-poulet-policier-bleu.svg'),
'picto_alt' => 'Pictogramme d\'un poulet policier pour les histoires poulets-policiers pendants le Tour de France',
'picto_title' => 'Pictogramme d\'un poulet policier',
'title' => 'Insolite, un pompier en tant que chauffeur d’un char cocotte Le Gaulois',
'title' => 'Histoire de poulet',
'content' =>
'Nicolas, pompier engagé, a rencontré l’équipe de la caravane Le Gaulois lors d’une intervention de secours pour une jeune caravanière Le Gaulois. Depuis, Nicolas, rebaptisé Pimpon, fait partie de l’équipe Le Gaulois, sillonnant les routes de France à bord d’une des mythiques Cocottes. On aime les histoires qui finissent bien !',
'Avec un sens de l’humour aguerri, Cocotte rencontre <a href="https://www.youtube.com/watch?v=reI-Z8UE3lM" target="_blank">un sympathique collègue</a> au détour d’un passage dans un village sur les routes du Tour de France.',
],
[
'picto_url' => Vite::asset('resources/assets/images/page-tdf/caravane/Picto-sirène-pompier-rouge.svg'),
'picto_alt' => 'Pictogramme d\'une sirène d\'alarme pour les anecdoctes insolites pendant le Tour de France',
'picto_title' => 'Pictorgramme d\'une alarme',
'title' => 'Un pompier en tant que chauffeur d’un char Le Gaulois !',
'content' =>
'Nicolas, pompier engagé, a procédé à une intervention de secours pour une jeune caravanière Le Gaulois. Depuis, Nicolas, rebaptisé Pimpon Le Gaulois, sillonne toujours les routes de France à bord d\'un char Cocotte.',
],
];
@endphp
<section class="py-5" id="au-coeur-de-la-caravane">
<h2 class="fw-bold text-uppercase mb-5 text-center">Au cœur de la caravane Le Gaulois</h2>
<section id="au-coeur-de-la-caravane">
<h2 class="fw-bold text-uppercase mb-md-5 mb-0 text-center">Au cœur de la caravane Le Gaulois</h2>
<div class="position-relative line-border-large">
<div class="position-absolute left-100 w-100 start-0 z-0">
<div class="position-absolute left-100 w-100 d-none d-md-block start-0 z-0">
<img class="img-fluid w-100 h-auto" src="{{ Vite::asset('resources/assets/images/page-tdf/caravane/TDF2033-caravaniers.png') }}"
title="Equipe des caravaniers Le Gaulois" alt="Ensemble de l'équipe des caravaniers Le Gaulois devant l'Arc de Triomphe" />
</div>
@ -53,10 +53,10 @@
<div class="col-3 d-flex flex-column justify-content-center">
<img class="w-50 mx-auto mb-2" src="{{ $a['picto_url'] }}" title="{{ $a['picto_title'] }}"
alt="{{ $a['picto_alt'] }}">
<div class="fw-bold text-uppercase fs-6 text-center">{{ $a['title'] }}</div>
</div>
<div class="col-9">
<p class="f-bakerie-rough fs-4 fw-normal">"{!! $a['content'] !!}"</p>
<div class="fw-bold text-uppercase fs-6 text-start">{{ $a['title'] }}</div>
<p class="f-bakerie-rough fs-4 fw-normal">{!! $a['content'] !!}</p>
</div>
</div>
@endforeach

8
resources/views/components/fo/page-tdf/char-slider.blade.php
View file

@ -104,12 +104,12 @@
@endforeach
</div>
</div>
<button class="swiper-button swiper-button-prev-custom swiper-chars-button-prev rounded-circle z-1 border-0 bg-white">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
<button class="swiper-button swiper-button-prev-custom swiper-chars-button-prev rounded-circle z-1 bg-secondary border-0">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
</button>
<button class="swiper-button swiper-button-next-custom swiper-chars-button-next rounded-circle z-1 border-0 bg-white">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
<button class="swiper-button swiper-button-next-custom swiper-chars-button-next rounded-circle z-1 bg-secondary border-0">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
</button>
</div>

38
resources/views/components/fo/page-tdf/game.blade.php
View file

@ -10,7 +10,10 @@
</div>
<div class="w-100 rounded-3 line-border-medium position-relative z-1 bg-white p-5 shadow">
<h3 class="fw-bold text-uppercase mb-2">Jouez et tentez de gagner !</h3>
<p class="mb-3">Participez à notre jeu concours du <b>Tour de France 2025</b> avec Le Gaulois.</p>
<p class="mb-3">Participez à notre <a class="text-decoration-underline"
href="https://www.legauloistourdefrance.fr/reglement" target="_blank"><strong>jeu 100% gagnant
</strong></a> Le Gaulois pendant le
Tour de France 2025.</p>
<a class="btn btn-danger text-uppercase mb-4" href="https://www.legauloistourdefrance.fr" target="_blank">Je tente
ma chance
!</a>
@ -20,30 +23,27 @@
src="{{ Vite::asset('resources/assets/images/page-tdf/TV-home-cinéma.png') }}"
title="5 Ensembles TV-Home cinéma à gagner"
alt="Ensemble TV-Home cinéma à gagner pendant le jeu TDF 100% gagnant Le Gaulois">
<div>5</div>
<div class="fw-bold">Ensembles TV + Home Cinema</div>
<div class="fw-bold text-uppercase">Ensembles TV + Home Cinema</div>
</div>
<div class="col-4">
<img class="images-100-percent mb-1"
src="{{ Vite::asset('resources/assets/images/page-tdf/Casque-audios-oreilles-libres.png') }}"
title="40 Casques audios oreilles libres à gagner"
alt="Casques audios oreilles libres à gagner pendant le jeu TDF 100% gagnant Le Gaulois">
<div>30</div>
<div class="fw-bold">Casque audio oreilles libres</div>
<div class="fw-bold text-uppercase">Casque audio oreilles libres</div>
</div>
<div class="col-4">
<img class="images-100-percent mb-1"
src="{{ Vite::asset('resources/assets/images/page-tdf/Bons-d-achat.png') }}"
title="Milliers de bons d'achats à gagner"
alt=" Bons de réduction à gagner pendant le jeu TDF 100% gagnant Le Gaulois">
<div>Des milliers</div>
<div class="fw-bold">Bons d'achats</div>
<div class="fw-bold text-uppercase">Bons d'achats</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 col-md-6 d-flex position-relative" id="come-section">
<div class="col-12 col-md-6 d-flex flex-column position-relative" id="come-section">
<div class="ms-md-5 position-relative z-2 bg-white shadow" id="come">
<div class="d-flex align-items-center mb-2">
<div class="point-exclamation me-3">
@ -54,13 +54,14 @@
</div>
<p class="mb-2"><b>Télécharger notre pancarte et retrouver nous sur la route&nbsp;du tour de France !</b></p>
<p class="mb-3">Le Tour de France est un rendez-vous immanquable qui marque le début de la pause estivale. Venez
nous rejoindre au bord des routes avec votre pancarte Cocotte Le Gaulois ! Lorsque l’animateur du char
nous rejoindre au bord des routes avec votre <strong>pancarte Cocotte Le Gaulois !</strong> Lorsque l’animateur du
char
d’ouverture de la caravane, Arthur, et ses acolytes caravaniers et caravanières vous repèrent, ils vous
enverront des petits cadeaux.</p>
<p><strong>Petit conseil :</strong> En agitant fièrement votre pancarte, vous augmenterez vos chances de recevoir
des cadeaux !</p>
<div class="d-flex flex-wrap gap-3">
<a class="btn btn-dark" href="{{ asset('tdf-downloads/Pancarte COULEURS(A4).png') }}" download>
<a class="btn btn-dark" href="{{ asset('tdf-downloads/Pancarte.pdf') }}" download>
<i class="fa-solid fa-arrow-down"></i>
<span>Télécharger la pancarte</span>
</a>
@ -70,15 +71,20 @@
</a>
</div>
</div>
<div class="img-1-wrapper line-border-small position-absolute z-1 bg-white p-2">
<div class="line-border-small d-none d-md-block">
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/page-tdf/char.jpg') }}" alt="Tour parcours">
<div class="ms-md-5 mt-4">
<small>Crédit photo - ASO Aurélien Vialatte</small>
</div>
<div class="d-none d-md-block img-1-wrapper line-border-small position-absolute z-1 bg-white p-2">
<div class="line-border-small">
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/page-tdf/char.jpg') }}"
title="Caravane Le Gaulois au mileu des supporters du Tour de France" alt="Chars de la caravane Le Gaulois">
</div>
</div>
<div class="img-2-wrapper line-border-small position-absolute z-1 bg-white p-2">
<div class="line-border-small d-none d-md-block">
<div class="d-none d-md-block img-2-wrapper line-border-small position-absolute z-1 bg-white p-2">
<div class="line-border-small">
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/page-tdf/char-cuisson-express.jpg') }}"
alt="Tour parcours">
title="Char cocotte Cuisson Express traversant un pont lors d'une étape du Tour de France"
alt="Char Cuisson Express Le Gaulois">
</div>
</div>
</div>

20
resources/views/components/fo/page-tdf/hero.blade.php
View file

@ -7,18 +7,24 @@
<div class="d-flex justify-content-between align-items-center mb-1">
<h1 class="fw-bold text-uppercase fs-1">Le Gaulois en selle pour le tour de
France</h1>
<div class="d-flex align-items-center logo-tdf gap-2">
<div class="d-flex align-items-center logo-tdf mt-md-0 mt-5 gap-2">
<img src="{{ Vite::asset('resources/assets/images/page-tdf/logo-gaulois-tdf.jpg') }}"
title="Logo volaille officielle de Le Gaulois et le Tour de France"
alt="Logo volaille officielle de Le Gaulois et le Tour de France">
</div>
</div>
<p class="w-md-75 mb-3">Le Gaulois est sponsor du Tour de France depuis 2015. Un événement populaire qui s’adresse à
tous
les
Français.<br>Un moment convivial, fun et chaleureux que les Français apprécient devant leur télévision et sur le
bord
des routes de la course. Un événement au <b>bon vivre à la française</b>.</p>
<p class="w-md-75 mb-3">
Depuis 2015, Le Gaulois est fier d’être <strong>la volaille officielle du Tour de France</strong>. Un évènement
populaire marquant le début de la pause estivale qui s’adresse à tous les Français, un rendez-vous immanquable pour des
milliers de passionnés aux bords des routes ou devant leur télévision. <strong>La convivialité, le partage et la bonne
humeur</strong>
sont au rendez-vous et c’est ce <strong>bon vivre à la française</strong> que la caravane Le Gaulois véhicule en
sillonnant les routes de
France chaque année. Des milliers de cadeaux sont distribués pour ravir les petits comme les plus grands. La
participation à cet évènement est également l’occasion de réaffirmer auprès du public, <strong>l’engagement sur
l’origine 100%
française des volailles Le Gaulois !</strong>
</p>
<div class="d-flex justify-content-center flex-wrap gap-3">
<a class="btn btn-tertiary" href="#le-gaulois-et-le-tour-de-france">Le Gaulois et le Tour de France</a>
<a class="btn btn-tertiary" href="#au-coeur-de-la-caravane">Au cœur de la caravane le Gaulois</a>

9
resources/views/components/fo/page-tdf/ten-years.blade.php
View file

@ -1,9 +1,10 @@
<section class="bg-light py-5" id="le-gaulois-et-le-tour-de-france">
<section class="bg-light pb-5" id="le-gaulois-et-le-tour-de-france">
<div class="container">
<h2 class="fw-bold text-uppercase mb-5 text-center">Le Gaulois et le Tour de France</h2>
<div class="row align-items-center">
<div class="col-md-6">
<h3 class="fw-bold mb-4">Le Gaulois et le Tour : <span class="text-danger">10 années de complicité avec le public</span>
<h3 class="fw-bold mb-4">Le Gaulois et le Tour : Plus de 10 années <span class="text-danger"> de complicité avec le
public</span>
</h3>
<p class="fs-5"><strong>Les chars « Cocottes » sont devenus emblématiques de la caravane du Tour de France.</strong>
<strong>Dix-huit
@ -28,8 +29,8 @@
</p>
</div>
<div class="col-md-6 text-center">
<div class="line-border-medium position-relative bg-white p-2">
<div class="position-relative d-inline-block line-border-medium w-100 ten-year-video-height">
<div class="position-relative bg-white p-2 shadow">
<div class="ratio ratio-16x9 position-relative d-inline-block line-border-small w-100">
@if (\App\Rules\IsValidYoutubeId::validates('hY0WPbkf4Ow'))
<div class="video-inlaid h-100" type="youtube"
href="https://www.youtube.com/embed/hY0WPbkf4Ow?autoplay=0&loop=1">

28
resources/views/components/fo/page-tdf/testimonials.blade.php
View file

@ -7,7 +7,7 @@
'anecdote' =>
'Nous cherchions un cri de guerre pour se motiver pour les étapes. Après avoir trouvé celui-ci, je ne sais pas pourquoi j’ai conclu par un cri de coq ! Résultat : celui est resté jusqu\'à la fin du tour et même plus, il est passé au JT 19/20 sur France 3 Rhône-Alpes Auvergne',
'adventure' =>
'Cette année, je l’avoue, ce fût le meilleur de tous, grâce une équipe hyper soudée, bosseuse et jamais fatiguée.',
'Cette année 2023, je l’avoue, ce fût le meilleur de tous, grâce une équipe hyper soudée, bosseuse et jamais fatiguée.',
'img_url' => Vite::asset(
'resources/assets/images/page-tdf/testimonials/Nicolas-Joly-caravanier-Le-Gaulois-Etienne-Coudret.jpg',
),
@ -48,7 +48,7 @@
],
[
'name' => 'Justine',
'alias' => 'Ca percute !',
'alias' => 'Ça percute !',
'sign' => 'La floflo de Florence Foresti',
'anecdote' => "
Comme scène marquante, je dirais le nombre de spectateurs sur la route nous regardant comme des « stars ». Je n'ai pas de scène drôle en particulier dans ma tête, mais tous les soirs au « cul du camion » comme nous le disons, un debrief avec rigolade et humour avec toute l’équipe est organisé.",
@ -67,7 +67,7 @@
<h2 class="fw-bold text-uppercase mb-5 text-center">Les témoignages des caravaniers</h2>
<div class="d-flex justify-content-center mb-5 flex-wrap gap-4" id="swiper-anecdote-tdf-badges">
@foreach ($slides as $index => $slide)
<button class="btn text-uppercase fs-5 fw-medium px-4 py-1 text-black shadow-none" data-slide-index="{{ $index }}">
<button class="btn text-uppercase fs-5 fw-medium text-secondary px-4 py-1 shadow-none" data-slide-index="{{ $index }}">
{{ $slide['name'] }}
</button>
@endforeach
@ -107,20 +107,28 @@
</div>
</div>
<div class="rounded-3 position-relative line-border-large bg-white p-5">
<div>Le conseil de <b>{{ $slide['name'] }}</b><br />{{ $slide['advice'] }}</div>
<div>
<p class="text-uppercase">
<strong>Le conseil de <span class="mb-0 bg-black px-3 py-1 text-white">
{{ $slide['name'] }}</span></strong>
<br />
<br />
</p>
{{ $slide['advice'] }}
</div>
</div>
</div>
@endforeach
</div>
</div>
<button
class="swiper-button swiper-button-prev-custom swiper-anecdote-tdf-button-prev rounded-circle z-1 border-0 bg-white">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
class="swiper-button swiper-button-prev-custom swiper-anecdote-tdf-button-prev rounded-circle z-1 bg-secondary border-0">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
title="{{ __('Navigation du slider (gauche)') }}" alt="{{ __('flèche vers la gauche') }}">
</button>
<button
class="swiper-button swiper-button-next-custom swiper-anecdote-tdf-button-next rounded-circle z-1 border-0 bg-white">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-brown.svg') }}"
class="swiper-button swiper-button-next-custom swiper-anecdote-tdf-button-next rounded-circle z-1 bg-secondary border-0">
<img src="{{ Vite::asset('resources/assets/images/common/arrow-white.svg') }}"
title="{{ __('Navigation du slider (droite)') }}" alt="{{ __('flèche vers la droite') }}">
</button>
</div>
@ -148,10 +156,10 @@
function updateActiveBadge(activeIndex) {
badgeButtons.forEach((button, index) => {
if (index === activeIndex) {
button.classList.remove('text-black');
button.classList.remove('text-secondary');
button.classList.add('btn-primary', 'text-white');
} else {
button.classList.add('text-black');
button.classList.add('text-secondary');
button.classList.remove('btn-primary', 'text-white');
}
});