->files()
->orderByDesc('created_at')
->published()
- ->take(4)
+ ->take(10)
->get()
);
}
--- /dev/null
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="3.339" height="520.904" viewBox="0 0 3.339 520.904">
+ <defs>
+ <filter id="Rectangle_51">
+ <feOffset dx="3" input="SourceAlpha"/>
+ <feGaussianBlur stdDeviation="1.5" result="blur"/>
+ <feFlood flood-opacity="0.251" result="color"/>
+ <feComposite operator="out" in="SourceGraphic" in2="blur"/>
+ <feComposite operator="in" in="color"/>
+ <feComposite operator="in" in2="SourceGraphic"/>
+ </filter>
+ </defs>
+ <g data-type="innerShadowGroup">
+ <rect id="Rectangle_51-2" data-name="Rectangle 51" width="3.339" height="520.904" fill="#fff"/>
+ <g transform="matrix(1, 0, 0, 1, 0, 0)" filter="url(#Rectangle_51)">
+ <rect id="Rectangle_51-3" data-name="Rectangle 51" width="3.339" height="520.904" fill="#fff"/>
+ </g>
+ </g>
+</svg>
--- /dev/null
+<svg xmlns="http://www.w3.org/2000/svg" width="12.374" height="12.374" viewBox="0 0 12.374 12.374">
+ <g id="Groupe_114" data-name="Groupe 114" transform="translate(-329.47 -95.47)">
+ <line id="Ligne_18" data-name="Ligne 18" x2="16" transform="translate(330 107.314) rotate(-45)" fill="none" stroke="#1d5198" stroke-width="1.5"/>
+ <line id="Ligne_19" data-name="Ligne 19" x2="16" transform="translate(330 96) rotate(45)" fill="none" stroke="#1d5198" stroke-width="1.5"/>
+ </g>
+</svg>
el.addEventListener("click", () => {
document.querySelector("nav").classList.toggle("open");
el.classList.toggle("open");
+ document.querySelector("html,body").classList.toggle("overflow-y-hidden")
});
const notConnectedLink = document.querySelector('.notConnected');
e.preventDefault();
const $title = 'Accès réservé aux abonnés';
const $text = `<p>Veuillez vous <a class="underline" href="/login">connecter</a> ou
- découvrez nos offres d'<a class="underline" href="">abonnement</a>
+ découvrez nos offres d'<a class="underline" href="/demande-d-abonnement">abonnement</a>
</p>`;
popup($title,$text)
})
popup(text, '','success')
}
+ const mouseTarget = document.getElementById("pastille")
+ const pastille = document.querySelector(".pastille-inner")
+ mouseTarget.addEventListener("mouseenter", (e) => {
+ pastille.classList.add('onmouseover')
+ });
+ mouseTarget.addEventListener("mouseleave", (e) => {
+ pastille.classList.remove('onmouseover')
+ });
+
const emblaNode = document.querySelector('.embla')
if(emblaNode) {
const options = {
loop: false,
+ align: 'start',
container: '.embla__container',
slides: '.embla__slide',
- watchDrag: false,
+ watchDrag: true,
watchResize: true,
}
const embla = EmblaCarousel(emblaNode, options)
.logo {
margin-bottom: 32px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
margin: 0;
}
}
padding-top: 32px;
padding-bottom: 32px;
min-height: 80px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
padding-top: 14px;
padding-bottom: 14px;
}
p {
margin: 0 0 8px;
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
text-align: center;
}
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
margin: 0;
}
}
.psq-home {
&-banner {
- padding: 32px 0;
+ padding: 32px 0 0;
position: relative;
text-align: center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
padding: 64px 0;
text-align: left;
}
&:after {
background-color: $waveblue;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
right: calc((-3rem) - (100vw - 100%) / 2);
width: calc(33.33333333% + (100vw - 100%) / 2);
}
&:before {
background-color: $clearblue;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
right: calc(33.33333333% - 3rem);
width: calc((66.66666667% + 3rem) + (100vw - 100%) / 2);
}
.col2 {
gap: 23px 0;
align-items: center;
+ margin: 0;
+ z-index: 1;
+ background-color: $waveblue;
+ padding-top: 32px;
+ padding-bottom: 32px;
- @include media-breakpoint-down(md) {
- margin: 0;
- z-index: 1;
- background-color: $waveblue;
- padding-top: 32px;
- padding-bottom: 32px;
- }
-
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
+ background-color: transparent;
align-items: initial;
padding: 0 25px 0 calc(2rem + 64px);
}
position: relative;
margin-bottom: 42px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
margin-bottom: 0;
height: 369px;
max-width: 252px;
top: 0;
left: 0;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
position: static;
width: 100%;
}
}
+ .pastille-inner {
+ transition:transform 1s;
+ transform-style:preserve-3d;
+ transform-origin: right;
+ position: absolute;
+ bottom: 0;
+ right: 0;
+ z-index: 1;
+ @include media-breakpoint-up(xl) {
+ position: static;
+ transform-origin: right;
+ &.onmouseover {
+ transform: rotateY(360deg);
+ }
+ }
+ }
+
.pastille {
position: absolute;
height: 187px;
font-weight: 600;
bottom: -46px;
box-shadow: 0 6px 12px rgba(#122846, .16);
- @include media-breakpoint-up(lg) {
+ backface-visibility: hidden;
+
+
+ @include media-breakpoint-up(xl) {
bottom: 55px;
}
@include media-breakpoint-up(xl) {
right: 0;
transform: translateX(50%);
+ &.back {
+ transform: rotateY(180deg) translateX(-50%);
+ }
}
@media (max-width: 1340px) {
right: 19%;
}
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
right: -13%;
}
@include media-breakpoint-down(md) {
flex-direction: column;
align-items: center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
display: grid;
gap: 0 64px;
grid-template-columns: 387px 1fr;
.grid-1 {
margin-bottom: 16px;
- gap: 16px;
display: flex;
flex-direction: column;
align-items: center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
transform: scale(.7);
transform-origin: top left;
transition: all .3s;
.date {
font-size: 16px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
font-size: 20px;
}
font-weight: 600;
.cover {
max-width: 253px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
max-width: 100%;
grid-column: 1;
grid-row: 1 / 2;
.grid-2 {
padding-bottom: 32px;
- margin-top: 25px;
-
display: flex;
flex-direction: column;
gap: 8px;
@extend .dotted;
max-width: 344px;
width: 100%;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
max-width: 321px;
width: auto;
}
h2,a {
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
max-width: 231px;
}
}
h2 {
margin-bottom: 16px !important;
text-align: center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
text-align: left;
margin-bottom: 32px !important;
}
display: none;
}
&.embla {
- @media (min-width: 992px) and (max-width: 1461px) {
+ @media (min-width: 992px) and (max-width: 1380px) {
flex: 0 0 83.33333333%;
max-width: 83.33333333%;
margin: 0 auto !important;
.embla__container {
display: flex;
gap: 16px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
gap: 32px;
}
}
.embla__slide {
- flex: 0 0 calc((100% / 2) - 8px);
- @include media-breakpoint-up(lg) {
+ flex: 0 0 calc((100% / 2) - 8px);
+ @include media-breakpoint-up(xl) {
+ flex: 0 0 calc((100% / 4) - 25px);
+ }
+ @include media-breakpoint-up(xxl) {
flex: 0 0 calc((100% / 4) - 16px);
}
@media (min-width: 1461px) {
&.embla__next {
margin-right: auto;
}
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xxl) {
margin: 0;
position: absolute;
top: 50%;
margin-top: -25px;
& > div:first-child {
- margin-bottom: 16px;
- @include media-breakpoint-up(lg) {
- margin: 0;
- }
+ margin: 0;
}
.thumbnail {
- @include media-breakpoint-down(md) {
- height: 343px;
- width: 100% !important;
- order: 1;
+ height: 343px;
+ width: 100% !important;
+ order: 1;
+ @include media-breakpoint-up(xl) {
+ width: 50% !important;
+ height: auto;
+ order: initial;
}
img {
width: 100%;
padding: 32px;
border-bottom-right-radius: 3px;
border-top-right-radius: 3px;
+ width: 100% !important;
- @include media-breakpoint-down(md) {
- width: 100% !important;
- }
-
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
padding: 0 64px;
+ width: 50% !important;
}
h3 {
}
.line {
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
display: block !important;
}
}
text-align: center;
width: max-content !important;
align-items: center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
align-items: initial;
text-align: left;
gap: 29px;
}
p {
- @extend .d-lg-block;
+ @extend .d-xl-block;
display: none;
font-size: small;
font-weight: 500;
}
.nav-2 {
- background-color: $blue;
- left: -100%;
+ background-color: #1D5198;
+ left: 0;
position: absolute;
- top: 100%;
- z-index: 999;
- transition: left cubic-bezier(0,.32,.24,.84) .3s;
+ top: calc(100% - 64px);
+ z-index: 99;
+ transform: translateX(-100%);
+ transition: transform cubic-bezier(0,.32,.24,.84) .3s;
display: flex;
align-items: center;
justify-content: center;
&.open {
- left: 0;
+ transform: translateX(0);
}
li {
width: max-content;
font-size: 20px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
font-size: 16px;
}
}
}
}
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
display: block;
font-size: 16px;
height: auto !important;
.psq {
&-text-image-banner {
&:not(.decouvrir) {
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
padding-bottom: 0 !important;
}
}
.cover {
max-width: 384px;
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
order: 1;
margin: 0 auto;
max-width: 253px;
}
&-contact {
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
padding-bottom: 0 !important;
}
.bigtitle {
margin-bottom: 64px;
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
margin-bottom: 32px;
}
}
.psq-not-registered {
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
padding: 0;
}
}
text-align: left;
margin: 0;
padding: 16px 0 0;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
padding: 0 0 0 32px;
}
}
gap: 31px;
}
}
- .col-lg-4 {
+ .col-xl-4 {
gap: 16px;
@include media-breakpoint-down(md) {
gap: 50px;
.swal2{
&-container {
+ padding: 24px 16px 0;
background-color: rgba($blue,.9) !important;
}
+ &-modal {
+ padding: 32px 48px !important;
+ }
&-popup {
margin: 0;
padding: 64px;
text-decoration: underline;
}
}
+ &-title, &-html-container p {
+ @include media-breakpoint-down(xl) {
+ text-align: center !important;
+ }
+ }
&-title {
display: block;
padding: 0;
text-align: left;
font-size: 25px;
color: $blue;
- margin-bottom: 32px;
+ margin-bottom: 16px;
+ @include media-breakpoint-up(xl) {
+ margin-bottom: 32px;
+ }
}
&-html-container {
text-align: left !important;
padding: 0 !important;
+ overflow: visible;
}
&-close {
position: absolute;
right: -14px;
top: 9px;
transform: translateY(-50%);
+ @include media-breakpoint-down(xl) {
+ right: -8px;
+ }
svg {
overflow: visible;
display: block;
}
}
}
+
+div:where(.swal2-container).swal2-center>.swal2-popup {
+ @include media-breakpoint-down(xl) {
+ grid-column: 1;
+ grid-row: 1 !important;
+ place-self: start !important;
+ }
+}
margin: 0;
}
+button,button:focus {
+ outline: none;
+ box-shadow: none !important;
+}
+
+.box-shadow-cover {
+ box-shadow: 3px 3px 6px rgba(0,0,0,.26);
+}
+
@media print {
nav {
display: none;
}
.header-logo-link {
@extend .absolute--center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
position: initial !important;
transform: none !important;
}
width: 104px;
max-width: 850px;
display: block;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
width: 156px;
}
}
width: 32px;
color: #ffffff;
@extend .flex--center;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
border: 0 !important;
height: auto !important;
width: auto !important;
position: relative;
z-index: 2;
}
- &:after {
- background-color: $blue;
- border-radius: 50px;
- content: "";
- height: 30px;
- position: absolute;
- transform: scale(0);
- transition: transform .3s;
- width: 30px;
- }
&.open:after {
transform: scale(1);
}
font-weight: 600;
margin: 0;
transition: all .3s;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
font-weight: 500;
}
}
.bigtitle {
font-size: 39px;
font-weight: 700;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
font-size: 61px;
}
}
font-size: 39px;
margin-bottom: -12px;
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
font-size: 61px;
line-height: 61px;
margin: 0;
font-weight: 500;
padding: 12px 34px;
width: max-content;
+ transition: background-color .3s;
+ text-decoration: none !important;
+ &:hover {
+ background-color: #9d3a38;
+ }
}
.text-decoration-underline {
.card {
&-container-form {
padding-bottom: 64px;
- @include media-breakpoint-down(lg) {
+ @include media-breakpoint-down(xl) {
padding: 0;
}
&.card-decouvrir-psq {
padding: 32px 15px;
border: 1px solid #DCE0F5;
box-shadow: 0 3px 6px rgba(0, 0, 0, .16);
- @include media-breakpoint-up(lg) {
+ @include media-breakpoint-up(xl) {
padding: 64px;
}
}
padding: 0;
.form-group {
- margin-bottom: 16px;
+ margin-bottom: 14px;
}
label {
box-shadow: none;
outline: none;
}
+ @include media-breakpoint-down(xl) {
+ height: 48px;
+ }
}
.separate-line {
}
.g-recaptcha {
- margin-top: 28px;
+ margin: 28px 0 26px;
}
.form-option {
}
}
+.searchform input::placeholder {
+ color: #1D5198
+}
+
.underline {
text-decoration: underline;
}
top: 6px;
right: 0;
text-align: right;
+ strong {
+ font-weight: 600;
+ }
+ @include media-breakpoint-down(xl) {
+ position: static;
+ order: -1;
+ text-align: left;
+ margin-top: -5px;
+ }
}
}
@inject('settings', \A17\Twill\Repositories\SettingRepository::class)
@section('content')
- <div class="psq-text-image-banner bg-clearblue p-64-0">
+ <div class="psq-text-image-banner bg-clearblue py-4 xl:py-16">
<div class="container">
- <div class="psq-text-image-banner-container d-flex justify-content-between">
+ <div class="psq-text-image-banner-container d-flex justify-content-between max-xl:!gap-y-4">
<div class="psq-bloc-text psq-banner">
- <h1 class="bigtitle">{!! $settings->byKey('title_announcers') !!}</h1>
+ <h1 class="bigtitle !text-4xl xl:!text-6xl">{!! $settings->byKey('title_announcers') !!}</h1>
<div class="max-w-[387px] w-full m-auto xl:!m-0">
<div class="subtext mb-3 !text-xl">
{!! str_replace('\n', "<br>", $settings->byKey('subtitle_announcers')) !!}
<div class="psq-not-registered psq-annonceur">
<div class="container">
<div class="psq-banner psq-annonceur-banner p-64-0">
- <p class="subtext text-lg-left text-center">{!! $settings->byKey('title_brochure') !!}</p>
+ <p class="subtext text-xl-left text-center">{!! $settings->byKey('title_brochure') !!}</p>
<div class="row">
- <div class="col-lg-4 d-flex psq-annonceur-impression">
+ <div class="col-xl-4 d-flex psq-annonceur-impression">
<div class="psq-annonceur-impression-img shrink-0">
<img src="{{ @asset('img/fb_impression_x1.svg') }}" />
</div>
<p class="psq-annonceur-impression-tarif">{!! $settings->byKey('price_brochure_1') !!}</p>
</div>
</div>
- <div class="col-lg-4 d-flex psq-annonceur-impression">
+ <div class="col-xl-4 d-flex psq-annonceur-impression">
<div class="psq-annonceur-impression-img shrink-0">
<img src="{{ @asset('img/fb_impression_x4.svg') }}" />
</div>
<p class="psq-annonceur-impression-tarif">{!! $settings->byKey('price_brochure_2') !!}</p>
</div>
</div>
- <div class="col-lg-4 d-flex psq-annonceur-impression">
+ <div class="col-xl-4 d-flex psq-annonceur-impression">
<div class="psq-annonceur-impression-img shrink-0">
<img src="{{ @asset('img/fb_impression_x10.svg') }}" />
</div>
</div>
<div class="card form">
- <div class="card-header text-lg-left text-center">
+ <div class="card-header text-xl-left text-center">
{!! $settings->byKey('form_title_announcers') !!}
</div>
@extends('layouts.v2.app')
@section('title')
- <div class="p-64-0 mb-[96px] bg-clearblue">
+ <div class="py-4 xl:py-16 mb-4 xl:mb-24 bg-clearblue">
<div class="container">
- <h1 class="bigtitle !mb-6">Nos archives</h1>
- <form class="flex items-center gap-[15px] px-6 py-3 bg-white border border-1 border-[#DCE0F5] rounded-[3px]">
+ <h1 class="bigtitle !mb-4 xl:!mb-6 text-center xl:text-left">Nos archives</h1>
+ <form action="" class="searchform flex items-center gap-[15px] px-6 py-3 bg-white border-1 border-[#DCE0F5] rounded-[3px]">
<div>
<img src="{{ @asset('img/search_icon.svg') }}" alt="Lancer la recherche" />
</div>
- <input class="color-blue" style="::placeholder{ color: #1D5198; }" type="text" placeholder="Recherche..."/>
+ <input class="color-blue w-100 outline-0 font-medium" type="text" placeholder="Recherche..."/>
</form>
</div>
</div>
@endsection
@section('main')
<div class="container mb-16">
- <div class="flex flex-wrap gap-x-[16px] md:gap-x-[32px] gap-y-8">
+ <div class="flex flex-wrap gap-x-[16px] md:gap-x-[32px] gap-y-7 md:gap-y-16">
@foreach($all_pdf as $key => $pdf)
<div class="item-pdf-archive">
- <x-cover :pdf="$pdf" type="2">
+ <x-cover :pdf="$pdf" type="2" linkTo="read">
</x-cover>
</div>
@endforeach
</div>
<div class="form-group row">
- <div class="col-md-8 offset-lg-4">
+ <div class="col-md-8 offset-xl-4">
@error(recaptchaFieldName())
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
<x-cover :pdf="$last_pdf->first()" type="3">
</x-cover>
<div class="psq-bloc-text psq-banner">
- <h1 class="bigtitle">{!! $settings->byKey('main_title_discover_psq') !!}</h1>
- <p class="subtext f-20 max-w-[387px] w-full m-auto xl:!m-0">{!! $settings->byKey('subtitle_discover_psq') !!}</p>
+ <h1 class="bigtitle !text-4xl xl:!text-6xl">{!! $settings->byKey('main_title_discover_psq') !!}</h1>
+ <p class="subtext !text-base xl:!text-xl max-w-[387px] w-full !m-auto xl:!m-0">{!! $settings->byKey('subtitle_discover_psq') !!}</p>
</div>
</div>
</div>
</div>
<div class="bg-clearblue">
- <div class="container card-container-form card-decouvrir-psq">
+ <div class="container card-container-form card-decouvrir-psq !pt-0 xl:!pt-16">
<div class="card form">
- <div class="card-header text-lg-left text-center">
+ <div class="card-header text-xl-left text-center">
{!! $settings->byKey('form_title_discover_psq') !!}
</div>
<div class="card-body">
</div>
<div class="form-group">
- <label for="email">{!! $settings->byKey('form_email_pro') !!} *</label>
+ <label for="email">{{ $settings->byKey('form_email_pro') }} *</label>
<div>
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email">
</div>
- <div class="form-group mb-0">
+ <div class="form-group mb-0 max-xl:text-center">
<div>
<button type="submit" class="btn btnorange">
Envoyer
{!! $settings->byKey('form_email') !!}
</label>
- <div class="">
+ <div class="flex flex-wrap">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
@error('email')
{!! $settings->byKey('form_password') !!}
</label>
- <div class="">
+ <div class="flex flex-wrap">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="current-password">
@error('password')
<div class="form-group">
<div class="">
<div class="form-check">
- <input class="form-check-input" type="checkbox" name="remember" id="remember" checked>
+ <input class="form-check-input h-auto" type="checkbox" name="remember" id="remember" checked>
<label class="form-check-label" for="remember">
{!! $settings->byKey('form_remember_me') !!}
</label>
+
</div>
</div>
</div>
<div class="form-group mb-0 psq-login-cta-container">
- <div class="d-flex flex-column flex-lg-row align-items-lg-center">
+ <div class="flex flex-wrap flex-column flex-xl-row align-items-xl-center gap-x-8">
<button type="submit" class="btn btnorange">
{!! $settings->byKey('form_connexion_btn') !!}
</button>
<div class="dotted separate-line"></div>
<div class="">
- <a href="{{ route('discover.index') }}" class="btn btnorange bg-transparent not-registered-button">
+ <a href="{{ route('contact.subscribe') }}" class="btn btnorange bg-transparent not-registered-button !flex !items-center !justify-center max-xl:h-12 max-xl:!w-full max-xl:!px-8 max-xl:!py-1 max-xl:!text-2xs">
{!! $settings->byKey('form_not_register_btn') !!}
</a>
</div>
<div class="row justify-center">
<div class="col-md-8">
<div class="card form max-md:!border-0 max-md:!shadow-none">
- <div class="card-header">{{ __('Reset Password') }}</div>
+ <div class="card-header !text-center md:!text-left">{{ __('Reset Password') }}</div>
<div class="card-body">
@if (session('status'))
- <div class="alert alert-success" role="alert">
- {{ session('status') }}
- </div>
+ <x-sweetalert title="{{ session('status') }}" icon="success">
+ </x-sweetalert>
@endif
<form method="POST" action="{{ route('password.email') }}">
<div class="form-group">
<label for="email" class="text-md-right">{{ __('E-Mail Address') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email" autofocus>
@error('email')
<div class="row justify-center">
<div class="col-md-8">
<div class="card form max-md:!border-0 max-md:!shadow-none">
- <div class="card-header">{{ __('Reset Password') }}</div>
+ <div class="card-header !text-center md:text-left">{{ __('Reset Password') }}</div>
<div class="card-body">
<form method="POST" action="{{ route('password.update') }}">
<div class="form-group">
<label for="email" class="text-md-right">{{ __('E-Mail Address') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ $email ?? old('email') }}" required autocomplete="email" autofocus>
@error('email')
<div class="form-group">
<label for="password" class="text-md-right">{{ __('Password') }}</label>
- <div >
+ <div class="flex flex-wrap">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
@error('password')
<div class="form-group row">
<label for="password-confirm" class="text-md-right">{{ __('Confirm Password') }}</label>
- <div >
+ <div>
<input id="password-confirm" type="password" class="form-control" name="password_confirmation" required autocomplete="new-password">
</div>
</div>
<div class="form-group">
<label for="last_name" class="col-form-label text-md-right">{{ __('Nom') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="last_name" type="text" class="form-control @error('last_name') is-invalid @enderror" name="last_name" value="{{ old('last_name') }}" required autocomplete="family-name">
@error('last_name')
<div class="form-group">
<label for="first_name" class="col-form-label text-md-right">{{ __('Prénom') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="first_name" type="text" class="form-control @error('first_name') is-invalid @enderror" name="first_name" value="{{ old('first_name') }}" required autocomplete="given-name" autofocus>
@error('first_name')
<div class="form-group">
<label for="email" class="col-form-label text-md-right">{{ __('E-Mail Address') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email">
@error('email')
<div class="form-group">
<label for="employer" class="col-form-label text-md-right">{{ __('Employeur') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="employer" type="text" class="form-control @error('employer') is-invalid @enderror" name="employer" value="{{ old('employer') }}" required>
@error('employer')
<div class="form-group">
<label for="password" class="col-form-label text-md-right">{{ __('Password') }}</label>
- <div>
+ <div class="flex flex-wrap">
<input id="password" type="password" class="form-control @error('password') is-invalid @enderror" name="password" required autocomplete="new-password">
@error('password')
<div class="form-group">
- <div>
+ <div class="flex flex-wrap">
@error(recaptchaFieldName())
<span class="invalid-feedback" role="alert">
<strong>{{ $message }}</strong>
<div class="cover {{$class}}">
- <a class="img-link {{!Auth::check() ? 'notConnected' : ''}}" target="{{$target}}">
- <img class="d-block cover-over" src="{{$pdf->coverUrl}}" alt="">
+ <a class="img-link cursor-pointer {{!Auth::check() ? 'notConnected' : ''}}" href="{{Auth::check() ? $link : '#'}}" target="{{$target}}">
+ <img class="d-block cover-over box-shadow-cover" src="{{$pdf->coverUrl}}" alt="">
<div class="shadowcover">
- <img src="{{ @asset('img/ombre-magazine.svg') }}" />
+ <img class="max-h-[39px]" src="{{ @asset('img/ombre-magazine.svg') }}" />
</div>
</a>
- <div class="cover-title text-left bg-transparent">
+ <div class="cover-title text-left bg-transparent max-xs:!-mt-1">
<p class="font-bold bg-transparent">{{$pdf->title}}</p>
- <a href="{{Auth::check() ? $link : '#'}}" class="underline font-medium">Lire cette édition</a>
+ <a href="{{Auth::check() ? $link : '#'}}" class="underline font-medium {{!Auth::check() ? 'notConnected' : ''}}">Lire cette édition</a>
</div>
</div>
--- /dev/null
+<script>
+ Swal.fire({
+ title: "{{ $title }}" ?? null,
+ html: `{{ $slot }}`,
+ icon: "{{ $icon }}" ?? null,
+ showCloseButton: true,
+ showConfirmButton: false,
+ closeButtonHtml: `<div><svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 0 48 48">
+ <g id="Groupe_112" data-name="Groupe 112" transform="translate(-1158 -426)">
+ <g id="Groupe_110" data-name="Groupe 110" transform="translate(1382 887) rotate(180)">
+ <rect id="Rectangle_13" data-name="Rectangle 13" width="48" height="48" rx="24" transform="translate(176 413)" fill="#dce0f5"/>
+ </g>
+ <g id="Groupe_111" data-name="Groupe 111" transform="translate(47.511)">
+ <line id="Ligne_16" data-name="Ligne 16" y1="17" transform="translate(1128.49 443.99) rotate(-45)" fill="none" stroke="#1d5198" stroke-width="2"/>
+ <line id="Ligne_17" data-name="Ligne 17" y1="17" transform="translate(1140.51 443.99) rotate(45)" fill="none" stroke="#1d5198" stroke-width="2"/>
+ </g>
+ </g>
+ </svg>
+ </div>`
+ })
+</script>
{!! $settings->byKey('text_contact') !!}
</div>
</div>
- <div class="col-xl-9 full-width m-0">
+ <div class="col-xl-9 m-0">
<div class="card form">
- <div class="card-header text-lg-left text-center">
+ <div class="card-header text-xl-left text-center">
{!! $settings->byKey('form_title_contact') !!}
</div>
{!! $settings->byKey('form_fullname') !!}
</label>
- <div class="">
+ <div class="flex flex-wrap">
<input id="name" type="text" class="form-control @error('name') is-invalid @enderror" name="name" value="{{ old('name') }}" required autocomplete="full-name" autofocus>
@error('name')
{!! $settings->byKey('form_email') !!}
</label>
- <div class="">
+ <div class="flex flex-wrap">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email">
@error('email')
{!! $settings->byKey('form_employer') !!}
</label>
- <div class="">
+ <div class="flex flex-wrap">
<input id="organization" type="text" class="form-control @error('organization') is-invalid @enderror" name="organization" value="{{ old('organization') }}" required>
@error('organization')
{!! $settings->byKey('form_message') !!}
</label>
- <div class="">
+ <div class="flex flex-wrap">
<textarea id="comments" rows="3" type="text" class="form-control @error('comments') is-invalid @enderror" name="comments" value="{{ old('comments') }}"></textarea>
@error('comments')
<div class="form-group">
<div class="col-4"></div>
- <div class="">
+ <div class="flex flex-wrap">
{!! ReCaptcha::htmlFormSnippet() !!}
@error(recaptchaFieldName())
<span class="invalid-feedback d-block" role="alert">
</div>
- <div class="form-group mb-0 text-lg-left text-center">
+ <div class="form-group mb-0 text-xl-left text-center">
<button type="submit" class="btn btnorange">
Envoyer
</button>
<div class="psq-text-image-banner-container d-flex justify-content-between">
<div class="psq-bloc-text psq-banner">
<h1 class="bigtitle">{!! $settings->byKey('main_title_subscription') !!}</h1>
- <p class="subtext max-w-[387px] w-full">{!! $settings->byKey('subtitle_subscription') !!}</p>
+ <p class="subtext max-w-[387px] w-full max-xl:!m-auto">{!! $settings->byKey('subtitle_subscription') !!}</p>
<div class="lilline"></div>
- <div class="max-w-[387px] w-full">
+ <div class="max-w-[387px] w-full max-xl:m-auto">
<div class="font-semibold mb-3">{!! $settings->byKey('text_1_subscription') !!}</div>
{!! $settings->byKey('text_2_subscription') !!}
</div>
</div>
<div class="card form">
- <div class="card-header text-lg-left text-center">
+ <div class="card-header text-xl-left text-center">
{!! $settings->byKey('form_title_subscription') !!}
</div>
<div class="form-group">
<label for="name" class="col-form-label">{!! $settings->byKey('form_fullname') !!}*</label>
- <div>
+ <div class="flex flex-wrap">
<input id="name" type="text" class="form-control @error('name') is-invalid @enderror" name="name" value="{{ old('name') }}" required autocomplete="full-name" autofocus>
@error('name')
<div class="form-group">
- <label for="email" class="col-form-label">{!! $settings->byKey('form_email') !!}*</label>
+ <label for="email" class="col-form-label">{!! $settings->byKey('form_email_pro') !!}*</label>
- <div>
+ <div class="flex flex-wrap">
<input id="email" type="email" class="form-control @error('email') is-invalid @enderror" name="email" value="{{ old('email') }}" required autocomplete="email">
@error('email')
<div class="form-group">
<label for="organization" class="col-form-label">{!! $settings->byKey('form_employer') !!}*</label>
- <div>
+ <div class="flex flex-wrap">
<input id="organization" type="text" class="form-control @error('organization') is-invalid @enderror" name="organization" value="{{ old('organization') }}" required>
@error('organization')
<div class="form-group">
<label for="comments" class="col-form-label">{!! $settings->byKey('form_commentary') !!}</label>
- <div>
+ <div class="flex flex-wrap">
<textarea id="comments" rows="3" type="text" class="form-control @error('comments') is-invalid @enderror" name="comments" value="{{ old('comments') }}"></textarea>
@error('comments')
<div class="form-group">
- <div>
+ <div class="flex flex-wrap">
{!! ReCaptcha::htmlFormSnippet() !!}
@error(recaptchaFieldName())
<span class="invalid-feedback d-block" role="alert">
JSONDataType: 'json',
key: "{{config('flowpaper.key')}}",
-
WMode: 'transparent',
localeChain: 'fr_FR'
@section('content')
@if(session()->has('message'))
- <div class="alert alert-success alert-dismissible !m-0">
- <div class="container">
- {!! session('message') !!}
- <button type="button" class="close" data-dismiss="alert" aria-label="Close">
- <span aria-hidden="true">×</span>
- </button>
- </div>
- </div>
+ <x-sweetalert title="{!! session('message') !!}" icon="success">
+ </x-sweetalert>
@endif
@if(session()->has('warning'))
<div class="psq-home-banner">
<div class="row">
- <div class="col-lg-8 col1">
+ <div class="col-xl-8 col1 max-xl:!pt-4">
<div class="psq-home-edition-jour">
- <div class="grid-1">
+ <div class="grid-1 gap-0">
<h1 class="bigtitle">{!! $settings->byKey('main_title') !!}</h1>
- <p class="date m-0">{!! $settings->byKey('date_home') !!}</p>
- <a href="" class="btnorange">Lire le quotidien</a>
+ <p class="date !mt-6 xl:!mt-8">{{ ucfirst($last_pdf->first()->created_at->translatedFormat('l d F Y')) }}</p>
+ <a href="/view/{{ $last_pdf->first()['slug'] }}" class="btnorange mt-4">Lire le quotidien</a>
</div>
- <x-cover :pdf="$last_pdf->first()" type="3">
+ <x-cover :pdf="$last_pdf->first()" type="3" linkTo="read">
</x-cover>
<div class="grid-2">
<h2>{!! $settings->byKey('not_register_title') !!}</h2>
- <a href="" class="underline">{!! $settings->byKey('not_register_link') !!}</a>
+ <a href="{{ route('contact.subscribe') }}" class="underline font-medium">{!! $settings->byKey('not_register_link') !!}</a>
</div>
</div>
{{--@foreach($last_pdf->first()->headlines ?? [] as $headline)
</x-headline>
@endforeach--}}
</div>
- <div class="col-lg-4 col2 flex flex-col position-relative right-block" style="z-index:1;">
- <h2 class="m-0 regulartitle">{!! $settings->byKey('title_discover_home') !!}</h2>
- <div class="psq-home-pdfimage">
- <img src="{{ $last_pdf->first()->coverUrl }}" alt="" class="fb" />
- <div class="pastille">
- {!! $settings->byKey('text_discover_home') !!}
+ <div class="col-xl-4 col2 flex flex-col position-relative right-block" style="z-index:1;">
+ <h2 class="!m-0 regulartitle">{!! $settings->byKey('title_discover_home') !!}</h2>
+ <div class="psq-home-pdfimage relative">
+ <img src="{{ $last_pdf->first()->coverUrl }}" alt="" class="fb box-shadow-cover" />
+ <div class="pastille-inner">
+ <div class="pastille z-1 back">
+ <span class="opacity-0">{!! $settings->byKey('text_discover_home') !!}</span>
+ </div>
+ <div class="pastille z-1 front">
+ {!! $settings->byKey('text_discover_home') !!}
+ </div>
</div>
- <div class="shadowcover">
- <img src="{{ @asset('img/ombre-magazine.svg') }}" />
+ <div class="shadowcover max-xl:absolute max-xl:w-[238px] max-xl:bottom-0 max-xl:h-3 max-xl:translate-y-full">
+ <img class="max-xl:!h-auto" src="{{ @asset('img/ombre-magazine.svg') }}" />
</div>
</div>
- <a href="{{ route('discover.index') }}" class="btnorange">Offre découverte</a>
+ <a id="pastille" href="{{ route('discover.index') }}" class="btnorange xl:mt-4">Offre découverte</a>
</div>
</div>
</div>
- <div class="psq-home-last-edition row p-64-0">
+ <div class="psq-home-last-edition row p-64-0 !pb-10">
<div class="px-[2rem] flex flex-col">
<h2 class="mediumtitle m-0">{!! $settings->byKey('title_last_edition') !!}</h2>
<div id="carousel" class="flex flex-wrap m-0 embla">
<div class="embla__viewport">
<div class="embla__container">
- @foreach($last_pdf->slice(0, 7) as $key => $pdf)
- <div class="item embla__slide">
- <x-cover :pdf="$pdf" type="2">
- </x-cover>
- </div>
- <div class="item embla__slide">
- <x-cover :pdf="$pdf" type="2">
- </x-cover>
- </div>
+ @foreach($last_pdf as $key => $pdf)
<div class="item embla__slide">
- <x-cover :pdf="$pdf" type="2">
+ <x-cover :pdf="$pdf" type="2" linkTo="read">
</x-cover>
</div>
@endforeach
</div>
</div>
- <div class="line col-12 dotted hidden xl:block"></div>
+ <div class="line col-12 dotted hidden xl:block h-[26px]"></div>
- <div class="psq-home-section-footer flex flex-col lg:flex-row p-64-0 gap-[16px] lg:gap-[64px]">
- <div class="flex flex-auto flex-col lg:flex-row">
+ <div class="psq-home-section-footer flex flex-col xl:flex-row max-xl:!pb-4 p-64-0 gap-[16px] xl:gap-[64px]">
+ <div class="flex flex-auto flex-col xl:flex-row">
<div class="thumbnail w-50">
<img src="{{ @asset('img/offre_abonnement.png') }}" />
</div>
<a href="#" class="linkunderline">{!! $settings->byKey('not_register_link') !!}</a>
</div>
</div>
- <div class="w-full max-lg:h-[398px] lg:w-[384px] shrink-0 overflow-hidden bg-blue relative">
- <div class="p-64 flex flex-col justify-between items-center pdf-block radius relative h-full z-1">
+ <div class="w-full max-xl:h-[398px] xl:w-[384px] shrink-0 overflow-hidden bg-blue relative radius">
+ <div class="p-64 flex flex-col justify-between items-center pdf-block relative h-full z-1">
<h3 class="title-feuilleter regulartitle">{{ $settings->byKey('title_quotidien_home') }}</h3>
- <a href="#" class="btnorange fw-normal relative">Feuilleter un quotidien</a>
+ <a href="/view/{{ $last_pdf->first()['slug'] }}" class="btnorange fw-normal relative">Feuilleter un quotidien</a>
</div>
- <img class="absolute max-lg:h-full lg:w-100 left-1/2 top-[45%] lg:top-[48%] -translate-1/2" src="{{ asset('/img/quotidien.jpg') }}" alt="" />
+ <img class="absolute max-xl:h-full xl:w-100 left-1/2 top-[45%] xl:top-[48%] -translate-1/2" src="{{ asset('/img/quotidien.jpg') }}" alt="" />
</div>
</div>
--breakpoint-md: 768px;
--breakpoint-lg: 960px;
--breakpoint-xl: 1120px;
- --breakpoint-2xl: 100rem;
+ --breakpoint-2xl: 1200px;
--breakpoint-3xl: 120rem;
+
+ --text-4xl: 39px;
+ --text-2xs: 14px;
+
+ --text-2xs--line-height: 18px;
+ --text-base--line-height: 20px;
+ --text-lg--line-height: 25px;
+ --text-4xl--line-height: 39px;
+ --text-6xl--line-height: 61px;
}
</style>
<meta property="og:type" content="article" />
<meta property="og:locale" content="fr_FR" />
@endif
+
+ <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</head>
<body>
<div id="{{ !in_array(Route::currentRouteName(), ['contact.subscribe','annonceurs.index','contact.index', 'discover.index']) ? 'app' : '' }}">
<div class="container d-flex justify-content-between align-items-center">
@if(!isset($hideNav))
- <a href="/" class="header-logo-link">
+ <a href="/" class="header-logo-link relative z-100">
<img src="{{ asset('img/logo_top.svg') }}" class="header-logo" alt="">
</a>
</script>
<script src="https://unpkg.com/embla-carousel/embla-carousel.umd.js"></script>
<script src="https://unpkg.com/embla-carousel-autoplay/embla-carousel-autoplay.umd.js"></script>
- <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
</body>
</html>
<footer class="container-fluid pl-0 pr-0 !m-0">
- <div class="container flex justify-between items-center flex-col lg:flex-row">
+ <div class="container flex justify-between items-center flex-col xl:flex-row">
<img src="{{ @asset("img/logo_top.svg") }}" class="header-logo logo" alt="Prescription Quotidien" />
<p>Copyright © Prescription santé Quotidien.</p>
<a href="{{ route('mentions.index') }}">Mentions légales</a>
-<div id="openmenu" class="d-lg-none circlebutton">
+<div id="openmenu" class="d-xl-none circlebutton relative z-100">
<img src="{{asset('img/nav/9-menu.svg')}}" alt="Ouvrir le menu" />
- <img src="{{asset('img/nav/9-menu-white.svg')}}" class="openmenu-img hidden" alt="Ouvrir le menu" />
+ <img src="{{asset('img/nav/9-menu-close.svg')}}" class="openmenu-img hidden" alt="Ouvrir le menu" />
</div>
<nav class="nav-2 vh-100 vw-100">
- <ul class="flex flex-col lg:flex-row container">
+ <ul class="flex flex-col xl:flex-row container">
<li><a href="/" class="nav-2-item {{ Route::currentRouteName() === "home" ? 'active' : '' }} ">Accueil</a></li>
<li><a href="{{route('contact.subscribe')}}" class="nav-2-item {{ Route::currentRouteName() === "contact.subscribe" ? 'active' : '' }}">Abonnements</a></li>
<li><a href="{{route('archives.index')}}" class="nav-2-item {{ Route::currentRouteName() === "archives.index" ? 'active' : '' }}">Archives</a></li>
</nav>
<div>
- <div class="header-auth flex items-center">
+ <div class="header-auth flex items-center relative z-100">
@auth
<a href="{{route('account.index')}}" class="flex items-center">
- <p class="username img-link lg:!hidden circlebutton bg-transparent border border-1" style="border-color:#E6E7F2;">
+ <p class="username img-link xl:!hidden circlebutton bg-transparent border border-1" style="border-color:#E6E7F2;">
{{ Str::substr(Auth::user()->first_name,0,1) }}{{ Str::substr(Auth::user()->last_name,0,1) }}
</p>
- <p class="username img-link hidden text-xs xl:text-base lg:block fw-medium">
+ <p class="username img-link hidden text-xs xl:text-base xl:block fw-medium">
{{ Auth::user()->first_name }}
{{ Auth::user()->last_name }}
</p>
</a>
<form id="logout-form" action="{{ route('logout') }}" class="m-0" method="POST">
@csrf
- <button type="submit" class="logout hidden lg:block">Déconnexion</button>
+ <button type="submit" class="logout hidden xl:block">Déconnexion</button>
</form>
@endif
</div>
@guest
- <div class="circlebutton">
+ <div class="circlebutton relative z-100">
<div>
<a href="{{route('login')}}">
- <div class="d-lg-none">
+ <div class="d-xl-none">
<img src="{{asset('img/nav/8-login.svg')}}" alt="Connexion"/>
</div>
- <p class="login-btn hidden lg:block m-0">
+ <p class="login-btn hidden xl:block m-0">
Connexion
</p>
</a>
<img src="{!! asset('img/v2/img-a.jpg') !!}" alt="" class="w-100 mb-3">
- <h2 class="text-lg blue">ABONNEMENT INDIVIDUEL - DURÉE 1 AN</h2>
+ <h2 class="text-xl blue">ABONNEMENT INDIVIDUEL - DURÉE 1 AN</h2>
<p>Attention cette formule ne vous donne pas accès à la version PDF de la Lettre mais seulement à la version «liseuse»</p>
<p class="font-bold blue">490,00 euros HT la première année<br>et 590,00 euros HT les années suivantes</p>
- <h2 class="text-lg blue">ABONNEMENT COLLECTIF - DURÉE 1 AN</h2>
+ <h2 class="text-xl blue">ABONNEMENT COLLECTIF - DURÉE 1 AN</h2>
<p>Des formules d’abonnements collectifs, donnant accès aux deux versions, PDF et liseuse, sont possibles pour au moins 5 lecteurs de la même entreprise</p>
<a href="{!! route('contact.subscribe') !!}" class="btn btn-big">POUR RECEVOIR UN DEVIS DANS LA JOURNÉE</a>
Route::get('archives', 'ArchiveController@index')->name('archives.index');
- //Route::get('search', 'FileController@search')->name('archives');
+ Route::get('search', 'FileController@search')->name('archives');
Route::prefix('campagnes-et-communication')->group(function() {
Route::get('/', 'AdCampaignController@index')->name('com-campaign.index');