About page responsive 1/2
This commit is contained in:
Sebastien Hattry
parent
acd7e13c81
commit
58518d0238
9 changed files with 403 additions and 88 deletions
BIN
resources/assets/images/about-us/carte-france-reperes.png
Normal file
BIN
resources/assets/images/about-us/carte-france-reperes.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 35 KiB |
15
resources/assets/images/global/bg-red.svg
Normal file
15
resources/assets/images/global/bg-red.svg
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg id="Calque_2"
|
||||
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.63 164.29" preserveAspectRatio="none">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1{
|
||||
fill:#ea6852;
|
||||
stroke-width: 0px;
|
||||
}
|
||||
</style>
|
||||
</defs>
|
||||
<g id="nous_connaitre">
|
||||
<path class="cls-1" d="m.86,160.79c-.03.05-.06.08-.09.12.12.19.21.41.28.64.27.06.55.12.82.17.39-.08.8-.13,1.19-.17,0-.01,0-.02,0-.03h2.4s.03.02.03.02c.03-.01.06-.02.08-.03h3.59c.1.08.21.17.29.29-.16.12-.33.21-.51.28.56.1,1.07.28,1.56.54,3.55-.02,7.09-.08,10.66.3.44-.07.86-.05,1.26.18,1.03-.66,2.03.19,3.07.26,1.44-.47,2.52-.05,3.96-.46,2.79.68,6.16-.15,9.23-.19,1.55.19,2.95.8,4.4.02,2.25-.17,4.61.87,7.24.52.66-1.05,1.49-.23,2.2-.47,1.52.79,3.77.56,5.48.27l.22.24c3.48-.77,6.86.58,10.34-.19,1.63.07,4.23-.16,5.7.27,1.49-.17,3.8.44,5.27-.46,2.76.92,6.87.34,9.9.53,1.3-.48,3.01.44,4.4-.22,1.41-.11,2.74.13,3.93.74.73.06,2.04-.17,2.88.26.38-1.2,1.58-.35,2.2-.95.71-.36,1.14.73,1.74,0,1.54,1.03,3.04-1.04,4.4.26,1.12-.72,2.63.38,4.18.02.76-1.11,1.76.31,2.63-.47,2.25.98,4.56-.85,6.59.28,1.44.43,2.74-.92,3.96.26l5.49-.7c.49.42.92.49,1.55.25.76.79,2.2.55,3.07.26.38.3.81.25,1.11-.24,1.41.37,3.17.38,4.61.02,3.23.38,7.73.4,10.96.06,2.87,1.28,5.46-.39,8.14.52,1.25-.78,3.18-.53,4.61-.22.66-1.29,1.57.43,2.42-.47,1.3,1.69,2.53-1.28,3.72.26,1.06-1.47,1.71,1.09,3.09.26,2.53-.92,5.92.39,8.55-.71,1.76.7,3.64-.22,5.29.03,2.03.46,5.1.24,7.25.31,1.49-.17,3.8.44,5.27-.49.94,1.6,2.42.07,3.74.53.82-1.29,1.93.43,2.85-.5,1.11.82,2.9.59,4.18.26h.43c3.69.35,6.92-.44,10.31.57,1.93-1.53,3.69.92,5.73-.21.82-1.65,2.09.07,3.29-.5,1.22.82,3.09.59,4.4.26,1,.16,2.25.95,3.09.02,1.46.82,3.18-.53,4.37.29,4.18-.04,8.36-.89,12.54-.21,1.44-.84,2.74.41,3.96-.46.54,1.12,2.14-.17,2.2-.47-.57-.85,2.09-.56,2.02-.79l17.97.74c.41.13,3.29-.55,3.29-.55-.06.66-.74.66-1.12.96,2.19.83,4.4-.52,6.59.27,1.38.94,3.01-.29,4.61-.22,1.65.82,3.96.56,5.7.27,1.87.76,4.5.78,6.38.03,1.38.94,2.91-.77,4.18.5,1.39-1.02,1.98,1.31,3.53.53.98,0,1.63-.93,2.64-.98.38-1.08.4-1.49.13-2.58l.3.68.94-.25c.51.45,2.1-5.57.72-8.73.86-1.74.13-4,.02-5.94l.23-.25c.29-.76.52-2.16-.22-2.83,1.38-1.07-.68-1.91.01-3.33,1.44-1.87.19-4.95.26-7.46.69-.76,1.47-2.31.24-3.08-.73-2.58-.49-5.02-.2-7.71.24-2.76-.6-6.61.04-9.49.06-1.17-.16-3.08.25-4.38-1.02-1.27-.5-3.02.02-4.35-.79-1.62.7-3.42-.44-4.89,1.32-2.5-.49-4.83-.2-7.46.69-1.93.36-4.7-.2-6.67-.22-2.25.94-5.2.03-7.46.18-3.14-.2-6.22.27-9.52-.39-1.72.82-3.96-.21-5.65.06-.32-.17-.83.23-1.01.35-1.49.47-3.52-.67-4.64,1.03-1.26-.13-2.64.47-4.09-1.22-2.83.31-5.65.49-8.5-.55-6.16-.75-12.83-.61-19.02-1.22-1.47.41-3.27-.47-4.86.55-2.95-.03-5.52.52-8.47-.77-1.43.18-2.63-.47-4.13.63-.76.77-1.43.62-2.14-.26-1.2-1.99-1.76-3.25-1.11h-1.48l-10.3.07c.12-.6.01-1.32.06-1.95-2.09-1.04-4.83-1.05-7.03-1-.62-1.27-1.49.41-2.2-.49-2.26,2.31-4.77-2.29-6.17,1.69-.49-.7-1.08-1.24-1.98-1.01-1.25.17-3.34-.44-4.62.46-2.36-.37-5.1-.39-7.46-.04-2.36.05-4.56-.2-7.03.21-.16-.24-.54-.36-.43-.73-2.36.59-4.29.04-6.81.21-.55,1.59-1.49-.07-2.42.47-1-.91-2.47-.31-3.74-.5-1.09,1.53-2.74-.56-4.18.46-1.35-1.27-2.96.44-4.4-.26-1.14.93-2.47-.8-3.5.49-1.11-1.3-2.58.95-3.74-.53-1.2.42-2.09-.01-3.29.5-1.05-1-2.31.95-3.06-.77-1.82.59-3.36-.26-5.08.73-.54-.15-1.25.3-1.52-.52-.63,1.29-1.71-.43-2.2.5-2.79-1.01-6.54-.18-9.22-.8-.74.48-1.82.74-2.42.74-.79-.34-1.17.48-1.77.71-.43-1.9-2.04.65-1.97-1.49l-.87.48c-1.71-.73-4.23-.75-5.94-.03-3.66-.44-7.9-.22-11.43-.3-1.03.93-2.19-.8-3.07.5-1.27-1.24-2.26,1.31-3.31-.02-.11-.39.3-.51.46-.75-.68-.06-1.28.05-1.77.47-1.38.05-3.06-1.28-4.18.25-2.14-.28-4.23-.53-6.37-.79-1.74.75-3.61-.38-5.27-.03-1.19-2.15-2.58.86-3.97.97-.38-.45-1.3-.4-1.08-1.24l-2.2.23c-1.44-.37-2.75,1.83-3.96-.02-.54-.06-1.25,0-1.31.75l-.68-.76c-.38-.18-.54.3-.87.24-2.47-.74-5.1.34-7.46-.04-1.21-2.06-2.32,2.07-3.31-.74-.49,0-1.03-.13-1.3.48-.9.06-1.77.93-2.63.23-1.88.74-4.12-.44-6.16.48-.75-1.24-1.28.17-1.98.47-1.24-1.54-3.13.95-4.61-.51-.64-2.38-2.31.65-3.75.22-1.62-2.45-4.1.58-6.35-.79-1.93,1.41-4.39-.81-6.16.96-.43.06-.81-.06-1.08-.49-1.76-.82-3.8.52-5.29-.3-1.31.63-3.17-.26-4.4.73-.44.3-1.41.54-1.74-.25,0-.24-.05-.63.22-.75-1.22,0-2.09.92-3.32.98-.65-.64-1.35-.94-2.19-1.01-1.25,1.53-2.36-.92-3.72.22-1.97-1.46-3.97.73-5.94-.03-1.36-.43-.66,1.65-1.99,1.47-.91-2.15-3.33-1.04-4.83-.99-1.58,1.74-2.52-1.31-4.4-.26-1.2,1.62-1.73-1.37-3.07-.02-1.08-1.48-1.93.71-3.28-.02-2.71-.95-6,.75-8.79-.56-1.28,1.71-3.07-.26-4.62.73-1.33-.82-2.63.53-3.96-.26-1.55,1.44-2.9-.95-4.61.22-1.54-1.12-2.64,1.07-4.18-.02-.87.84-2.52-.59-3.5.22-1.02.98-3.07-.98-3.86.75h-.16c-.39-1.6-1.21-.2-2.08-.01h-.25c-.08-.01-.16,0-.24-.05-.38-.18-.16-.66-.21-.97-3.12-.71-6.38,1.23-9.44-.05-.79-.25-1.33.66-1.98-.01-1.33.72-2.52-.4-3.96-.02-.6.06-.82,1.14-1.52.96-1.16-1.54-3.37-.08-4.61-1.23-.66.82-1.49.78-2.32.64-.13-.12-.33-.16-.62-.11-.08-.01-.16-.02-.24-.04-.74-.77-1.47-.46-2.21-.07v4.03s.08,0,.11,0l.44,71.96c-.16,1.26-.37,2.56.02,3.74v2.21c-.06.75-.07,1.47.03,2.19l.02,2.87c-.75,3.32-.02,7.37-.61,10.76,1.05,2.51-.02,5.33-.03,7.97,1.05,1.69-.02,3.62-.02,5.4,0,1.3-.01,2.89-.02,3.87.69,4.61-.38,9.11-.06,13.87-1.09.69.16,1.52-.24,2.57-.53,4.47.02,9.11-.51,13.87-.06.63.11,1.46,0,1.78.38,1.91.25,3.87.11,5.81-.14,0-.29,0-.43,0-.03,1.03-.07,2.05-.14,3.08.14-.02.28-.05.43-.08-.01,1.29.07,2.56.44,3.79Z"/>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 5.2 KiB |
|
|
@ -1,10 +1,4 @@
|
|||
.w-fit {
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
img { max-width: 100%; }
|
||||
|
||||
.form-check-input[type="checkbox"]:checked {
|
||||
#{--bs-form-check-bg-image}: url("@/images/global/checkbox-cross.svg");
|
||||
|
|
@ -69,7 +63,6 @@ img {
|
|||
@include button-shape(#ba9964);
|
||||
}
|
||||
|
||||
|
||||
.black-frame {
|
||||
padding-top: 4rem;
|
||||
padding-bottom: 2rem;
|
||||
|
|
@ -80,6 +73,13 @@ img {
|
|||
}
|
||||
}
|
||||
|
||||
.rotate-n45 {
|
||||
rotate: -45deg;
|
||||
}
|
||||
|
||||
.rotate-n3 {
|
||||
rotate: -3deg;
|
||||
}
|
||||
|
||||
// XXXXXXX XXXXXXXLLLLLLLLLLL
|
||||
// X:::::X X:::::XL:::::::::L
|
||||
|
|
|
|||
|
|
@ -78,3 +78,25 @@
|
|||
.f-basecoat {
|
||||
font-family: Basecoat, sans-serif !important;
|
||||
}
|
||||
|
||||
.fsize-12 { font-size: 12px; }
|
||||
.fsize-22 { font-size: 22px; }
|
||||
.fsize-33 { font-size: 33px; }
|
||||
.fsize-44 { font-size: 44px; }
|
||||
.fsize-50 { font-size: 50px; }
|
||||
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
@include media-breakpoint-up(lg) {
|
||||
.fsize-lg-22 { font-size: 22px; }
|
||||
.fsize-lg-40 { font-size: 40px; }
|
||||
.fsize-lg-60 { font-size: 60px; }
|
||||
.fsize-lg-80 { font-size: 80px; }
|
||||
.fsize-lg-90 { font-size: 90px; }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -131,3 +131,10 @@
|
|||
font-family: 'Readex Pro', sans-serif !important;
|
||||
}
|
||||
}
|
||||
|
||||
.bg-nota-bene {
|
||||
background-image: url("@/images/global/bg-red.svg");
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -14,8 +14,15 @@
|
|||
h1::after { bottom: -1rem; }
|
||||
|
||||
.frise {
|
||||
.year-bloc { max-width: 500px; }
|
||||
.date-bloc .ratio,
|
||||
.year-bloc {
|
||||
max-width: 500px;
|
||||
}
|
||||
|
||||
// 1 : 1987
|
||||
// 2 : 1988
|
||||
// 3 : 1989
|
||||
// 7 : 2008
|
||||
.date-bloc:first-child,
|
||||
.date-bloc:nth-child(2),
|
||||
.date-bloc:nth-child(3),
|
||||
|
|
@ -23,30 +30,34 @@
|
|||
.year-bloc img { max-width: 50%; }
|
||||
}
|
||||
|
||||
// 4 : 1991
|
||||
.date-bloc:nth-child(4) {
|
||||
.year-bloc img { max-width: 75%; }
|
||||
}
|
||||
|
||||
// 5 : 1995
|
||||
// 9 : 2018
|
||||
.date-bloc:nth-child(5),
|
||||
.date-bloc:nth-child(9) {
|
||||
.year-bloc img { max-width: 100%; }
|
||||
}
|
||||
|
||||
// 6 : 2005
|
||||
.date-bloc:nth-child(6) {
|
||||
.year-bloc img { max-width: 10%; }
|
||||
}
|
||||
|
||||
.date-bloc:nth-child(8) {
|
||||
// 8 : 2009
|
||||
// 11 : 2021
|
||||
.date-bloc:nth-child(8),
|
||||
.date-bloc:nth-child(11) {
|
||||
.year-bloc img { max-width: 25%; }
|
||||
}
|
||||
|
||||
// 10 : 2020
|
||||
.date-bloc:nth-child(10) {
|
||||
.year-bloc img { max-width: 40%; }
|
||||
}
|
||||
|
||||
.date-bloc:nth-child(11) {
|
||||
.year-bloc img { max-width: 30%; }
|
||||
}
|
||||
}
|
||||
|
||||
.black-frame {
|
||||
|
|
@ -56,4 +67,31 @@
|
|||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.round-style{
|
||||
li::before { content:'•'; }
|
||||
}
|
||||
}
|
||||
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
// LG
|
||||
@include media-breakpoint-up(lg) {
|
||||
.frise {
|
||||
// 6 : 1989
|
||||
.date-bloc:nth-child(6) .year-bloc {
|
||||
background-color: $color-light;
|
||||
}
|
||||
}
|
||||
|
||||
.sub-container {
|
||||
max-width: 1000px;
|
||||
margin-right: auto;
|
||||
margin-left: auto;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -36,6 +36,12 @@
|
|||
.w#{$infix}-100 {
|
||||
width: 100% !important;
|
||||
}
|
||||
.w#{$infix}-xcont {
|
||||
width: max-content !important;
|
||||
}
|
||||
.w#{$infix}-fit {
|
||||
width: fit-content !important;
|
||||
}
|
||||
|
||||
@each $prop, $unit in (width: vw, height: vh) {
|
||||
@each $size in [25, 50, 75, 100] {
|
||||
|
|
@ -47,7 +53,18 @@
|
|||
}
|
||||
}
|
||||
|
||||
// * Utilities
|
||||
// * UTILITIES
|
||||
// * Sizing
|
||||
$utilities: map.merge(
|
||||
$utilities, (
|
||||
"height": map.merge(
|
||||
map.get($utilities, "height"),
|
||||
( responsive: true ),
|
||||
),
|
||||
)
|
||||
);
|
||||
|
||||
// * Position
|
||||
$utilities: map.merge(
|
||||
$utilities, (
|
||||
"position": map.merge(
|
||||
|
|
@ -56,8 +73,141 @@ $utilities: map.merge(
|
|||
),
|
||||
)
|
||||
);
|
||||
$utilities: map.merge(
|
||||
$utilities, (
|
||||
"start": map.merge(
|
||||
map.get($utilities, "start"),
|
||||
( responsive: true ),
|
||||
),
|
||||
)
|
||||
);
|
||||
$utilities: map.merge(
|
||||
$utilities, (
|
||||
"top": map.merge(
|
||||
map.get($utilities, "top"),
|
||||
( responsive: true ),
|
||||
),
|
||||
)
|
||||
);
|
||||
|
||||
// * Styles
|
||||
.rotate-n45 {
|
||||
rotate: -45deg;
|
||||
}
|
||||
// * Letter spacing
|
||||
$utilities: map.merge(
|
||||
$utilities,
|
||||
(
|
||||
"letter-spacing": (
|
||||
property: letter-spacing,
|
||||
class: ls,
|
||||
responsive: true,
|
||||
values: (
|
||||
'normal': normal,
|
||||
1: 1px,
|
||||
2: 2px,
|
||||
3: 3px,
|
||||
4: 4px,
|
||||
)
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
// * Spacing
|
||||
$spacer: 1rem;
|
||||
$spacers: (
|
||||
0: 0,
|
||||
1: $spacer * .25,
|
||||
2: $spacer * .5,
|
||||
3: $spacer,
|
||||
4: $spacer * 1.5,
|
||||
5: $spacer * 3,
|
||||
10: $spacer * 10,
|
||||
);
|
||||
$utilities: map.merge(
|
||||
$utilities,
|
||||
(
|
||||
// Margin utilities
|
||||
"margin": (
|
||||
responsive: true,
|
||||
property: margin,
|
||||
class: m,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
"margin-x": (
|
||||
responsive: true,
|
||||
property: margin-right margin-left,
|
||||
class: mx,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
"margin-y": (
|
||||
responsive: true,
|
||||
property: margin-top margin-bottom,
|
||||
class: my,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
"margin-top": (
|
||||
responsive: true,
|
||||
property: margin-top,
|
||||
class: mt,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
"margin-end": (
|
||||
responsive: true,
|
||||
property: margin-right,
|
||||
class: me,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
"margin-bottom": (
|
||||
responsive: true,
|
||||
property: margin-bottom,
|
||||
class: mb,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
"margin-start": (
|
||||
responsive: true,
|
||||
property: margin-left,
|
||||
class: ms,
|
||||
values: map.merge($spacers, (auto: auto))
|
||||
),
|
||||
// Padding utilities
|
||||
"padding": (
|
||||
responsive: true,
|
||||
property: padding,
|
||||
class: p,
|
||||
values: $spacers
|
||||
),
|
||||
"padding-x": (
|
||||
responsive: true,
|
||||
property: padding-right padding-left,
|
||||
class: px,
|
||||
values: $spacers
|
||||
),
|
||||
"padding-y": (
|
||||
responsive: true,
|
||||
property: padding-top padding-bottom,
|
||||
class: py,
|
||||
values: $spacers
|
||||
),
|
||||
"padding-top": (
|
||||
responsive: true,
|
||||
property: padding-top,
|
||||
class: pt,
|
||||
values: $spacers
|
||||
),
|
||||
"padding-end": (
|
||||
responsive: true,
|
||||
property: padding-right,
|
||||
class: pe,
|
||||
values: $spacers
|
||||
),
|
||||
"padding-bottom": (
|
||||
responsive: true,
|
||||
property: padding-bottom,
|
||||
class: pb,
|
||||
values: $spacers
|
||||
),
|
||||
"padding-start": (
|
||||
responsive: true,
|
||||
property: padding-left,
|
||||
class: ps,
|
||||
values: $spacers
|
||||
),
|
||||
)
|
||||
);
|
||||
|
|
|
|||
|
|
@ -48,3 +48,6 @@ $h3-font-size: $font-size-base * $heading-multiplicator * 1.75;
|
|||
$h4-font-size: $font-size-base * $heading-multiplicator * 1.5;
|
||||
$h5-font-size: $font-size-base * $heading-multiplicator * 1.25;
|
||||
$h6-font-size: $font-size-base * $heading-multiplicator;
|
||||
|
||||
// Enable negative margin
|
||||
$enable-negative-margins: true;
|
||||
|
|
|
|||
|
|
@ -7,15 +7,17 @@
|
|||
|
||||
@section('content')
|
||||
<div class="about-us">
|
||||
|
||||
{{-- EN-TETE --}}
|
||||
<div class="container">
|
||||
<div class="row position-relative flex-column-reverse flex-lg-row">
|
||||
<div class="col-lg-8 position-absolute mt-lg-0 top-100 start-50 translate-middle-x mt-4">
|
||||
<div class="col-lg-8 position-absolute mt-lg-0 top-100 top-lg-0 start-50 translate-middle-x mt-4">
|
||||
<img class="img-fluid h-lg-100" src="{{ Vite::asset('resources/assets/images/about-us/depuis-1987.png') }}"
|
||||
alt="{{ __('Depuis 1987') }}" />
|
||||
</div>
|
||||
<div class="col-lg-8 col-xl-6 mt-lg-3">
|
||||
<div class="d-lg-inline-block text-center">
|
||||
<h1 class="position-relative d-lg-inline-block f-sheldon text-uppercase ls-1 my-4">{{ __($staticPageModel->title) }}</h1>
|
||||
<h1 class="position-relative d-lg-inline-block f-sheldon ls-1 my-4">{{ __($staticPageModel->title) }}</h1>
|
||||
</div>
|
||||
<div class="text-lg-start w-lg-75 text-center">
|
||||
<p class="f-rufina fs-5 lh-sm fw-bold">
|
||||
|
|
@ -29,22 +31,30 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- FRISE --}}
|
||||
<div class="frise position-relative position-lg-static container">
|
||||
<div class="row mb-5">
|
||||
<div class="date-bloc col-12 col-lg-6 mt-4">
|
||||
|
||||
{{-- 1987 --}}
|
||||
<div class="date-bloc col-12 mt-4">
|
||||
<div class="year-bloc d-flex flex-column justify-content-center align-items-center mx-auto text-center">
|
||||
<img class="img-fluid mb-2" src="{{ Vite::asset('resources/assets/images/about-us/cocotte.png') }}"
|
||||
alt="{{ __('Une cocotte minute orange') }}" />
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight orange mx-auto mb-2 w-fit px-3 text-white">
|
||||
{{ __('1987') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-3 mb-2">{{ __('Création de la société') }}</p>
|
||||
<p class="f-readex-pro fw-bold lh-sm mx-3">{{ __('grâce à l\'innovation de la cuisson sous vide.') }}</p>
|
||||
<div class="position-relative mx-4">
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-3 mb-2">{{ __('Création de la société') }}</p>
|
||||
<p class="f-readex-pro fw-bold lh-sm">{!! clean('grâce à l\'innovation<br>de la cuisson sous vide.') !!}</p>
|
||||
<img class="d-none d-lg-block position-absolute end-100 top-100 translate-middle-y z-1"
|
||||
src="{{ Vite::asset('resources/assets/images/about-us/pointilles-01.png') }}" alt="{{ __('Des pointillés') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5">
|
||||
|
||||
{{-- 1988 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 mt-lg-0 mb-lg-0 my-5">
|
||||
<div class="ratio ratio-1x1">
|
||||
<div
|
||||
class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle bg-light mx-auto text-center">
|
||||
|
|
@ -55,12 +65,14 @@
|
|||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Rayon Traiteur coupe :') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">{{ __('Lancement gamme plats cuisinés') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-5">{{ __('Lancement gamme plats cuisinés') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5">
|
||||
|
||||
{{-- 1989 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 mt-lg-10 mb-lg-0 my-5">
|
||||
<div class="ratio ratio-1x1">
|
||||
<div
|
||||
class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle bg-light mx-auto text-center">
|
||||
|
|
@ -72,28 +84,35 @@
|
|||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Rayon Libre-service :') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-5">
|
||||
{{ __('Démarrage des gammes à marque distributeurs') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5">
|
||||
<div class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center mx-auto text-center">
|
||||
|
||||
{{-- 1991 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 mt-lg-n5 my-5">
|
||||
<div
|
||||
class="year-bloc position-relative d-flex flex-column flex-lg-row justify-content-center align-items-center mx-auto text-center">
|
||||
<img class="img-fluid mb-3" src="{{ Vite::asset('resources/assets/images/about-us/asiatique.png') }}"
|
||||
alt="{{ __('Dessin d\'un plat de nouilles chinoises avec des assortiments variés') }}" />
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight deep-orange mx-auto mb-2 px-4 text-white">
|
||||
{{ __('1991') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Agis démarre') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">{{ __('Les gammes asiatiques') }}
|
||||
<div class="text-wrapper ms-lg-n5">
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight deep-orange mx-auto mb-2 w-fit px-4 text-white">
|
||||
{{ __('1991') }}
|
||||
</p>
|
||||
<div class="mx-lg-0 mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Agis démarre') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-5">{{ __('Les gammes asiatiques') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5">
|
||||
|
||||
{{-- 1995 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 mt-lg-10 pt-lg-10 my-5">
|
||||
<div
|
||||
class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center rounded-circle mx-auto text-center">
|
||||
<img class="position-absolute top-50 start-50 translate-middle img-fluid"
|
||||
|
|
@ -104,40 +123,50 @@
|
|||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-3 mb-0">{{ __('Commercialisation des') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">{{ __('Coffrets festifs') }}
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-5">{{ __('Coffrets festifs') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5">
|
||||
<div class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center mx-auto text-center">
|
||||
<img class="img-fluid mb-3" src="{{ Vite::asset('resources/assets/images/global/logo-ldc-traiteur.svg') }}"
|
||||
alt="{{ __('Logo de l\'entité LDC Traiteur') }}" />
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight yellow mx-auto mb-2 px-2 text-white">
|
||||
{{ __('2005') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Agis devient') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">{{ __('Filiale à 100% du Groupe LDC') }}
|
||||
|
||||
{{-- 2005 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 mt-lg-n5">
|
||||
<div class="ratio ratio-1x1">
|
||||
<div class="year-bloc d-flex flex-column justify-content-center align-items-center rounded-circle mx-auto text-center">
|
||||
<img class="img-fluid mb-3" src="{{ Vite::asset('resources/assets/images/global/logo-ldc-traiteur.svg') }}"
|
||||
alt="{{ __('Logo de l\'entité LDC Traiteur') }}" />
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight yellow mx-auto mb-2 px-2 text-white">
|
||||
{{ __('2005') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Agis devient') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-5">{!! clean('Filiale à 100%<br>du Groupe LDC') !!}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- 2008 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 my-5">
|
||||
<div class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center mx-auto text-center">
|
||||
<img class="img-fluid mb-3" src="{{ Vite::asset('resources/assets/images/about-us/pasta-box.png') }}"
|
||||
alt="{{ __('Dessin d\'un plat de nouilles chinoises avec des assortiments variés') }}" />
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight green mx-auto mb-2 px-2 text-white">
|
||||
{{ __('2008') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Lancement') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">{{ __('des Pasta Box') }}
|
||||
<div class="d-lg-flex align-items-center">
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight green mx-auto mb-2 w-fit px-2 text-white">
|
||||
{{ __('2008') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-lg-0 mx-4 mb-0">{{ __('Lancement') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-lg-0 mx-5">{{ __('des Pasta Box') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5 pb-5">
|
||||
|
||||
{{-- 2009 --}}
|
||||
<div class="date-bloc col-12 my-5 pb-5">
|
||||
<div class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center mx-auto text-center">
|
||||
<div class="d-flex justify-content-center align-items-center mb-3">
|
||||
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/about-us/rouleaux-printemps.png') }}"
|
||||
|
|
@ -149,16 +178,18 @@
|
|||
alt="{{ __('Dessin d\'un rouleau de printemps') }}" />
|
||||
</div>
|
||||
<div class="mx-4">
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-4">{{ __('Nos premiers rouleaux de printemps') }}
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-4">{{ __('Nos premiers rouleaux de printemps') }}
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-3 mb-0">{{ __('arrivent sur le marché') }}</p>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc col-12 col-lg-6 my-5 py-5">
|
||||
|
||||
{{-- 2018 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 mt-lg-0 pt-lg-0 my-5 py-5">
|
||||
<div
|
||||
class="year-bloc position-relative d-flex flex-column justify-content-center align-items-center rounded-circle mx-auto text-center">
|
||||
<div class="position-absolute top-50 start-50 translate-middle w-100 pb-4">
|
||||
<div class="position-absolute top-50 start-50 translate-middle w-100 pb-lg-0 pt-lg-4 pb-4">
|
||||
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/about-us/specialites-exotiques.png') }}"
|
||||
alt="{{ __('Dessin d\'une marmite avec une toque de chef et des assortiments') }}" />
|
||||
<p
|
||||
|
|
@ -168,12 +199,14 @@
|
|||
</div>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-0 mb-0">{{ __('Nouveaux ateliers') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-4">{{ __('Plats cuisinés & spécialités exotiques') }}
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-4">{!! clean('Plats cuisinés &<br>spécialités exotiques') !!}
|
||||
</p>
|
||||
<p class="f-readex-pro fw-bold text-uppercase lh-sm mx-5 mb-0">{{ __('Pour le rayon frais emballé') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{-- 2020 --}}
|
||||
<div class="date-bloc col-12 col-lg-6 my-5 pt-5">
|
||||
<div class="ratio ratio-1x1">
|
||||
<div
|
||||
|
|
@ -184,67 +217,114 @@
|
|||
{{ __('2020') }}
|
||||
</p>
|
||||
<div>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-0">{{ __('Lancement des Bo Bun') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-0">{{ __('Lancement des Bo Bun') }}</p>
|
||||
<p class="f-readex-pro fw-bold text-uppercase lh-sm mx-0 mb-0">{!! clean('Au rayon Frais emballé<br>Nouveau savoir-faire Sushi,<br>grâce à Asia General Food') !!}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="date-bloc position-relative col-12 col-lg-6 mb-5">
|
||||
{{-- <div class="ratio ratio-1x1"> --}}
|
||||
<div class="year-bloc d-flex flex-column align-items-center mx-auto text-center">
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight deep-green mx-auto mb-2 px-2 text-white">
|
||||
{{ __('2021') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Création de la') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 text-uppercase lh-base mx-5">{{ __('nouvelle identité !') }}
|
||||
|
||||
{{-- 2021 --}}
|
||||
<div class="date-bloc position-relative col-12 mb-5">
|
||||
<div class="year-bloc d-flex flex-column flex-lg-row align-items-center align-items-lg-start mx-auto text-center">
|
||||
<div class="mx-lg-4">
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight deep-green mx-auto mb-2 w-fit px-2 text-white">
|
||||
{{ __('2021') }}
|
||||
</p>
|
||||
<div class="mx-4">
|
||||
<p class="f-readex-pro fw-bold text-uppercase mx-4 mb-0">{{ __('Création de la') }}</p>
|
||||
<p class="f-sheldon fw-bold h4 lh-base mx-lg-0 mx-5">{{ __('nouvelle identité !') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<img class="img-fluid" src="{{ Vite::asset('resources/assets/images/global/logo-vertical.png') }}"
|
||||
alt="{{ __('Dessin d\'un plat de nouilles chinoises avec des assortiments variés') }}" />
|
||||
</div>
|
||||
<img class="position-absolute top-50 start-100 translate-middle img-fluid w-75 h-75"
|
||||
<img class="position-absolute top-50 start-100 start-lg-0 translate-middle-y img-fluid w-75 h-75 h-lg-100"
|
||||
src="{{ Vite::asset('resources/assets/images/layout/bg-compass.svg') }}"
|
||||
alt="{{ __('Dessin d\'une boussole avec l\'inscription Explorateur et Gastronome depuis 1987') }}" />
|
||||
{{-- </div> --}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
{{-- NOS SAVOIR-FAIRE --}}
|
||||
<div class="row mb-5">
|
||||
<div class="col position-relative">
|
||||
<div class="black-frame position-absolute w-100 h-100 z-n1 start-0 top-0 px-1 pb-0 pt-3">
|
||||
<div class="position-relative w-100 h-100"></div>
|
||||
</div>
|
||||
<div class="mx-auto px-2">
|
||||
<div class="mx-auto w-fit bg-white px-4">
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight black mb-0 w-fit px-4 text-white">
|
||||
{{ __('Nos savoir-faire') }}
|
||||
</p>
|
||||
</div>
|
||||
<p class="">{!! clean(
|
||||
<p class="text-lg-center m-0 p-4">{!! clean(
|
||||
'Depuis 1987, Agis vous simplifie la vie pour vous proposer des recettes "comme à la maison".<br>Nous sommes curieux, ouverts sur le monde et avons à cœur de faire voyager vos papilles.<br>Nous explorons et innovons avec toujours plus de créativité.<br>Du plat cuisiné traditionnel aux recettes les plus exotiques, nous vous proposons une palette généreuse de saveurs.',
|
||||
) !!}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row highlight deep-orange">
|
||||
<div class="col-6">
|
||||
<p>{{ __('simplicité') }}</p>
|
||||
<p>{{ __('performance') }}</p>
|
||||
<p>{{ __('travail') }}</p>
|
||||
|
||||
{{-- MOTS CLES --}}
|
||||
<div class="row bg-nota-bene lh-sm mb-5 py-3">
|
||||
<div class="col-6 position-relative p-2 py-3 pe-1 text-end">
|
||||
<p class="f-sheldon fsize-33 fsize-lg-60 ls-2 m-0">{{ __('simplicité') }}</p>
|
||||
<p class="f-rufina fsize-22 fsize-lg-40 fw-bold m-0">{{ __('performance') }}</p>
|
||||
<p class="f-sheldon fsize-44 fsize-lg-80 ls-2 m-0">{{ __('travail') }}</p>
|
||||
<p
|
||||
class="position-absolute start-100 translate-middle-x f-readex-pro fsize-12 fsize-lg-22 fw-bold highlight white rotate-n3 w-xcont mb-lg-0 bottom-0 mb-2 px-3">
|
||||
{{ __('Nos valeurs') }}
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-6">
|
||||
<p>{{ __('respect') }}</p>
|
||||
<p>{{ __('Responsabilité') }}</p>
|
||||
<p>{{ __('innovation') }}</p>
|
||||
<div class="col-6 p-2 ps-1">
|
||||
<p class="f-sheldon fsize-50 fsize-lg-90 ls-1 m-0">{{ __('respect') }}</p>
|
||||
<p class="f-rufina fsize-22 fsize-lg-40 fw-bold m-0">{{ __('Responsabilité') }}</p>
|
||||
<p class="f-sheldon fsize-33 fsize-lg-60 ls-1 m-0">{{ __('innovation') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
|
||||
{{-- NOS EXPLORATEURS --}}
|
||||
<div class="row sub-container mb-5">
|
||||
<div class="col">
|
||||
<p>{!! clean(
|
||||
'Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.<br><br>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.',
|
||||
) !!}</p>
|
||||
<p class="f-readex-pro fs-5 fw-bold highlight black w-lg-fit mb-3 px-4 text-white">
|
||||
{{ __('Nos Explorateurs') }}
|
||||
</p>
|
||||
<div class="row">
|
||||
<p class="col-12 col-lg-6">
|
||||
{{ __('Nous disposons de 3 sites de fabrication spécialisés par famille de produits, modernes et répondant aux plus hautes exigences en matière d\'hygiène et de sécurité alimentaire.') }}
|
||||
</p>
|
||||
<p class="col-12 col-lg-6">
|
||||
{{ __('Nous avons également investi dans un centre de préparation des commandes permettant d\'offrir un excellent service logistique.') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row sub-container mb-5">
|
||||
<div class="col-12 col-lg-6 text-lg-start mb-3 text-center">
|
||||
<h2 class="f-sheldon mb-4">{{ __('Nos ateliers') }}</h2>
|
||||
<ul class="list-unstyled round-style lh-sm">
|
||||
<li class="mb-3">
|
||||
<span class="f-readex-pro fw-bold text-uppercase mb-0">{{ __('Herbignac (44)') }}</span>
|
||||
<p class="f-rufina">{{ __('Spécialités asiatiques') }}</p>
|
||||
</li>
|
||||
<li class="mb-3">
|
||||
<span class="f-readex-pro fw-bold text-uppercase mb-0">{{ __('Tarare (69)') }}</span>
|
||||
<p class="f-rufina">{!! clean('Spécialités asiatiques<br>& plateforme logistique') !!}</p>
|
||||
</li>
|
||||
<li class="mb-3">
|
||||
<span class="f-readex-pro fw-bold text-uppercase mb-0">{{ __('Avignon (84)') }}</span>
|
||||
<p class="f-rufina">{{ __('Plats cuisinés et festifs') }}</p>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-12 col-lg-6 mb-3">
|
||||
<div class="img-wrapper">
|
||||
<img src="{{ Vite::asset('resources/assets/images/about-us/carte-france-reperes.png') }}"
|
||||
alt="{{ __('Un dessin d\'une carte de la France avec les repères des sites Agis') }}">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue