From: soufiane <soufiane@cubedesigners.com>
Date: Thu, 26 Jun 2025 08:48:42 +0000 (+0200)
Subject: wip #7359 @3:00
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=6d69bf1121624fc00d1cc44a7722eb11197e3433;p=psq.git

wip #7359 @3:00
---

diff --git a/app/Http/Controllers/Controller.php b/app/Http/Controllers/Controller.php
index 7ede847..c343073 100644
--- a/app/Http/Controllers/Controller.php
+++ b/app/Http/Controllers/Controller.php
@@ -27,7 +27,7 @@ class Controller extends BaseController
             ->files()
             ->orderByDesc('created_at')
             ->published()
-            ->take(4)
+            ->take(10)
             ->get()
         );
     }
diff --git a/public/img/fluidbook-layer.svg b/public/img/fluidbook-layer.svg
new file mode 100644
index 0000000..40fb51d
--- /dev/null
+++ b/public/img/fluidbook-layer.svg
@@ -0,0 +1,18 @@
+<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>
diff --git a/public/img/nav/9-menu-close.svg b/public/img/nav/9-menu-close.svg
new file mode 100644
index 0000000..b61cc30
--- /dev/null
+++ b/public/img/nav/9-menu-close.svg
@@ -0,0 +1,6 @@
+<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>
diff --git a/public/img/quotidien.jpg b/public/img/quotidien.jpg
index 62a0820..425e8c5 100644
Binary files a/public/img/quotidien.jpg and b/public/img/quotidien.jpg differ
diff --git a/resources/js/app.js b/resources/js/app.js
index eafd02b..7d2283a 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -69,6 +69,7 @@ document.addEventListener("DOMContentLoaded", () => {
     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');
@@ -85,7 +86,7 @@ document.addEventListener("DOMContentLoaded", () => {
             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)
         })
@@ -96,13 +97,23 @@ document.addEventListener("DOMContentLoaded", () => {
         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)
diff --git a/resources/sass/_footer.scss b/resources/sass/_footer.scss
index f9ecb35..c74969e 100644
--- a/resources/sass/_footer.scss
+++ b/resources/sass/_footer.scss
@@ -8,7 +8,7 @@ footer {
 
     .logo {
         margin-bottom: 32px;
-        @include media-breakpoint-up(lg) {
+        @include media-breakpoint-up(xl) {
             margin: 0;
         }
     }
@@ -19,7 +19,7 @@ footer {
     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;
     }
@@ -31,10 +31,10 @@ footer {
 
     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;
         }
     }
diff --git a/resources/sass/_home.scss b/resources/sass/_home.scss
index 0bd2a53..c059d7d 100644
--- a/resources/sass/_home.scss
+++ b/resources/sass/_home.scss
@@ -1,11 +1,11 @@
 .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;
         }
@@ -20,7 +20,7 @@
 
         &: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);
             }
@@ -28,7 +28,7 @@
 
         &: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);
             }
@@ -45,16 +45,14 @@
         .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);
             }
@@ -68,7 +66,7 @@
         position: relative;
         margin-bottom: 42px;
 
-        @include media-breakpoint-up(lg) {
+        @include media-breakpoint-up(xl) {
             margin-bottom: 0;
             height: 369px;
             max-width: 252px;
@@ -81,12 +79,29 @@
             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;
@@ -102,17 +117,23 @@
             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) {
@@ -126,7 +147,7 @@
         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;
@@ -138,12 +159,11 @@
 
         .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;
@@ -161,7 +181,7 @@
 
             .date {
                 font-size: 16px;
-                @include media-breakpoint-up(lg) {
+                @include media-breakpoint-up(xl) {
                     font-size: 20px;
                 }
                 font-weight: 600;
@@ -171,7 +191,7 @@
         .cover {
             max-width: 253px;
 
-            @include media-breakpoint-up(lg) {
+            @include media-breakpoint-up(xl) {
                 max-width: 100%;
                 grid-column: 1;
                 grid-row: 1 / 2;
@@ -188,8 +208,6 @@
 
         .grid-2 {
             padding-bottom: 32px;
-            margin-top: 25px;
-
             display: flex;
             flex-direction: column;
             gap: 8px;
@@ -197,7 +215,7 @@
             @extend .dotted;
             max-width: 344px;
             width: 100%;
-            @include media-breakpoint-up(lg) {
+            @include media-breakpoint-up(xl) {
                 max-width: 321px;
                 width: auto;
 
@@ -214,7 +232,7 @@
             }
 
             h2,a {
-                @include media-breakpoint-up(lg) {
+                @include media-breakpoint-up(xl) {
                     max-width: 231px;
                 }
             }
@@ -237,7 +255,7 @@
         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;
             }
@@ -248,7 +266,7 @@
                 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;
@@ -260,13 +278,16 @@
             .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) {
@@ -286,7 +307,7 @@
                 &.embla__next {
                     margin-right: auto;
                 }
-                @include media-breakpoint-up(lg) {
+                @include media-breakpoint-up(xxl) {
                     margin: 0;
                     position: absolute;
                     top: 50%;
@@ -308,17 +329,17 @@
         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%;
@@ -331,13 +352,11 @@
             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 {
@@ -367,7 +386,7 @@
     }
 
     .line {
-        @include media-breakpoint-up(lg) {
+        @include media-breakpoint-up(xl) {
             display: block !important;
         }
     }
diff --git a/resources/sass/_nav.scss b/resources/sass/_nav.scss
index e18af4e..d0ceac7 100644
--- a/resources/sass/_nav.scss
+++ b/resources/sass/_nav.scss
@@ -7,7 +7,7 @@ nav > ul {
     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;
@@ -29,7 +29,7 @@ nav > ul {
     }
 
     p {
-        @extend .d-lg-block;
+        @extend .d-xl-block;
         display: none;
         font-size: small;
         font-weight: 500;
@@ -57,23 +57,24 @@ nav > ul {
 }
 
 .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;
         }
     }
@@ -87,7 +88,7 @@ nav > ul {
         }
     }
 
-    @include media-breakpoint-up(lg) {
+    @include media-breakpoint-up(xl) {
         display: block;
         font-size: 16px;
         height: auto !important;
diff --git a/resources/sass/_page.scss b/resources/sass/_page.scss
index 72e799f..5eb3a5a 100644
--- a/resources/sass/_page.scss
+++ b/resources/sass/_page.scss
@@ -1,7 +1,7 @@
 .psq {
     &-text-image-banner {
         &:not(.decouvrir) {
-            @include media-breakpoint-down(lg) {
+            @include media-breakpoint-down(xl) {
                 padding-bottom: 0 !important;
             }
         }
@@ -47,7 +47,7 @@
 
         .cover {
             max-width: 384px;
-            @include media-breakpoint-down(lg) {
+            @include media-breakpoint-down(xl) {
                 order: 1;
                 margin: 0 auto;
                 max-width: 253px;
@@ -113,17 +113,17 @@
     }
 
     &-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;
             }
         }
@@ -152,7 +152,7 @@
             text-align: left;
             margin: 0;
             padding: 16px 0 0;
-            @include media-breakpoint-up(lg) {
+            @include media-breakpoint-up(xl) {
                 padding: 0 0 0 32px;
             }
         }
@@ -171,7 +171,7 @@
                 gap: 31px;
             }
         }
-        .col-lg-4 {
+        .col-xl-4 {
             gap: 16px;
             @include media-breakpoint-down(md) {
                 gap: 50px;
diff --git a/resources/sass/_popup.scss b/resources/sass/_popup.scss
index fd36d29..ea9e3cb 100644
--- a/resources/sass/_popup.scss
+++ b/resources/sass/_popup.scss
@@ -1,7 +1,11 @@
 .swal2{
     &-container {
+        padding: 24px 16px 0;
         background-color: rgba($blue,.9) !important;
     }
+    &-modal {
+        padding: 32px 48px !important;
+    }
     &-popup {
         margin: 0;
         padding: 64px;
@@ -11,23 +15,35 @@
             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;
@@ -38,3 +54,11 @@
         }
     }
 }
+
+div:where(.swal2-container).swal2-center>.swal2-popup {
+    @include media-breakpoint-down(xl) {
+        grid-column: 1;
+        grid-row: 1 !important;
+        place-self: start !important;
+    }
+}
diff --git a/resources/sass/app.scss b/resources/sass/app.scss
index 1c77a78..b0a4252 100644
--- a/resources/sass/app.scss
+++ b/resources/sass/app.scss
@@ -43,6 +43,15 @@ p {
     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;
@@ -72,7 +81,7 @@ header {
 }
 .header-logo-link {
     @extend .absolute--center;
-    @include media-breakpoint-up(lg) {
+    @include media-breakpoint-up(xl) {
         position: initial !important;
         transform: none !important;
     }
@@ -81,7 +90,7 @@ header {
     width: 104px;
     max-width: 850px;
     display: block;
-    @include media-breakpoint-up(lg) {
+    @include media-breakpoint-up(xl) {
         width: 156px;
     }
 }
@@ -323,7 +332,7 @@ article {
     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;
@@ -343,16 +352,6 @@ article {
         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);
     }
@@ -372,7 +371,7 @@ article {
     font-weight: 600;
     margin: 0;
     transition: all .3s;
-    @include media-breakpoint-up(lg) {
+    @include media-breakpoint-up(xl) {
         font-weight: 500;
     }
 }
@@ -399,7 +398,7 @@ article {
 .bigtitle {
     font-size: 39px;
     font-weight: 700;
-    @include media-breakpoint-up(lg) {
+    @include media-breakpoint-up(xl) {
         font-size: 61px;
     }
 }
@@ -417,7 +416,7 @@ article {
     font-size: 39px;
     margin-bottom: -12px;
 
-    @include media-breakpoint-up(lg) {
+    @include media-breakpoint-up(xl) {
         font-size: 61px;
         line-height: 61px;
         margin: 0;
@@ -445,6 +444,11 @@ article {
     font-weight: 500;
     padding: 12px 34px;
     width: max-content;
+    transition: background-color .3s;
+    text-decoration: none !important;
+    &:hover {
+        background-color: #9d3a38;
+    }
 }
 
 .text-decoration-underline {
@@ -488,7 +492,7 @@ article {
 .card {
     &-container-form {
         padding-bottom: 64px;
-        @include media-breakpoint-down(lg) {
+        @include media-breakpoint-down(xl) {
             padding: 0;
         }
         &.card-decouvrir-psq {
@@ -502,7 +506,7 @@ article {
         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;
         }
     }
@@ -518,7 +522,7 @@ article {
         padding: 0;
 
         .form-group {
-            margin-bottom: 16px;
+            margin-bottom: 14px;
         }
 
         label {
@@ -532,6 +536,9 @@ article {
                 box-shadow: none;
                 outline: none;
             }
+            @include media-breakpoint-down(xl) {
+                height: 48px;
+            }
         }
 
         .separate-line {
@@ -551,7 +558,7 @@ article {
     }
 
     .g-recaptcha {
-        margin-top: 28px;
+        margin: 28px 0 26px;
     }
 
     .form-option {
@@ -562,6 +569,10 @@ article {
     }
 }
 
+.searchform input::placeholder {
+    color: #1D5198
+}
+
 .underline {
     text-decoration: underline;
 }
@@ -593,6 +604,15 @@ article {
         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;
+        }
     }
 }
 
diff --git a/resources/views/annonceurs/index.blade.php b/resources/views/annonceurs/index.blade.php
index d523e9d..8087220 100644
--- a/resources/views/annonceurs/index.blade.php
+++ b/resources/views/annonceurs/index.blade.php
@@ -2,11 +2,11 @@
 @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')) !!}
@@ -26,9 +26,9 @@
     <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>
@@ -37,7 +37,7 @@
                             <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>
@@ -46,7 +46,7 @@
                             <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>
@@ -72,7 +72,7 @@
                 </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>
 
diff --git a/resources/views/archives/index.blade.php b/resources/views/archives/index.blade.php
index dda3941..b886694 100644
--- a/resources/views/archives/index.blade.php
+++ b/resources/views/archives/index.blade.php
@@ -1,24 +1,24 @@
 @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
diff --git a/resources/views/auth/discover.blade.php b/resources/views/auth/discover.blade.php
index dd0a62b..20a7634 100644
--- a/resources/views/auth/discover.blade.php
+++ b/resources/views/auth/discover.blade.php
@@ -77,7 +77,7 @@
                         </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>
diff --git a/resources/views/auth/discover/index.blade.php b/resources/views/auth/discover/index.blade.php
index 76ad139..2c8a4c7 100644
--- a/resources/views/auth/discover/index.blade.php
+++ b/resources/views/auth/discover/index.blade.php
@@ -9,17 +9,17 @@
                 <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">
@@ -57,7 +57,7 @@
                         </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">
@@ -110,7 +110,7 @@
                         </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
diff --git a/resources/views/auth/login.blade.php b/resources/views/auth/login.blade.php
index 7a20b61..6d382a3 100644
--- a/resources/views/auth/login.blade.php
+++ b/resources/views/auth/login.blade.php
@@ -21,7 +21,7 @@
                                 {!! $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')
@@ -37,7 +37,7 @@
                                 {!! $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')
@@ -51,17 +51,18 @@
                         <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>
@@ -77,7 +78,7 @@
                         <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>
diff --git a/resources/views/auth/passwords/email.blade.php b/resources/views/auth/passwords/email.blade.php
index e8ea086..fe173ba 100644
--- a/resources/views/auth/passwords/email.blade.php
+++ b/resources/views/auth/passwords/email.blade.php
@@ -5,13 +5,12 @@
     <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') }}">
@@ -20,7 +19,7 @@
                         <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')
diff --git a/resources/views/auth/passwords/reset.blade.php b/resources/views/auth/passwords/reset.blade.php
index ab77dd2..ef8522b 100644
--- a/resources/views/auth/passwords/reset.blade.php
+++ b/resources/views/auth/passwords/reset.blade.php
@@ -5,7 +5,7 @@
     <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') }}">
@@ -16,7 +16,7 @@
                         <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')
@@ -30,7 +30,7 @@
                         <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')
@@ -44,7 +44,7 @@
                         <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>
diff --git a/resources/views/auth/register.blade.php b/resources/views/auth/register.blade.php
index 3ef1767..3115a92 100644
--- a/resources/views/auth/register.blade.php
+++ b/resources/views/auth/register.blade.php
@@ -30,7 +30,7 @@
                         <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')
@@ -44,7 +44,7 @@
                         <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')
@@ -58,7 +58,7 @@
                         <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')
@@ -72,7 +72,7 @@
                         <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')
@@ -88,7 +88,7 @@
                         <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')
@@ -121,7 +121,7 @@
 
 
                         <div class="form-group">
-                            <div>
+                            <div class="flex flex-wrap">
                                 @error(recaptchaFieldName())
                                     <span class="invalid-feedback" role="alert">
                                         <strong>{{ $message }}</strong>
diff --git a/resources/views/components/cover.blade.php b/resources/views/components/cover.blade.php
index bd1bb6b..bf43284 100644
--- a/resources/views/components/cover.blade.php
+++ b/resources/views/components/cover.blade.php
@@ -1,12 +1,12 @@
 <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>
diff --git a/resources/views/components/sweetalert.blade.php b/resources/views/components/sweetalert.blade.php
new file mode 100644
index 0000000..8d68ae7
--- /dev/null
+++ b/resources/views/components/sweetalert.blade.php
@@ -0,0 +1,21 @@
+<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>
diff --git a/resources/views/contact/index.blade.php b/resources/views/contact/index.blade.php
index 1025c2b..ac393cb 100644
--- a/resources/views/contact/index.blade.php
+++ b/resources/views/contact/index.blade.php
@@ -37,10 +37,10 @@
                         {!! $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>
 
@@ -53,7 +53,7 @@
                                         {!! $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')
@@ -70,7 +70,7 @@
                                         {!! $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')
@@ -86,7 +86,7 @@
                                         {!! $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')
@@ -106,7 +106,7 @@
                                         {!! $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')
@@ -119,7 +119,7 @@
 
                                 <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">
@@ -130,7 +130,7 @@
                                 </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>
diff --git a/resources/views/contact/subscription-request.blade.php b/resources/views/contact/subscription-request.blade.php
index 6c8cac2..2ecd33b 100644
--- a/resources/views/contact/subscription-request.blade.php
+++ b/resources/views/contact/subscription-request.blade.php
@@ -7,9 +7,9 @@
             <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>
@@ -40,7 +40,7 @@
             </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>
 
@@ -51,7 +51,7 @@
                         <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')
@@ -64,9 +64,9 @@
 
 
                         <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')
@@ -80,7 +80,7 @@
                         <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')
@@ -94,7 +94,7 @@
                         <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')
@@ -135,7 +135,7 @@
 
 
                         <div class="form-group">
-                            <div>
+                            <div class="flex flex-wrap">
                                 {!! ReCaptcha::htmlFormSnippet() !!}
                                 @error(recaptchaFieldName())
                                 <span class="invalid-feedback d-block" role="alert">
diff --git a/resources/views/flowpaper/view.blade.php b/resources/views/flowpaper/view.blade.php
index 7a385bf..a4e698f 100644
--- a/resources/views/flowpaper/view.blade.php
+++ b/resources/views/flowpaper/view.blade.php
@@ -81,7 +81,6 @@
                                 JSONDataType: 'json',
                                 key: "{{config('flowpaper.key')}}",
 
-
                                 WMode: 'transparent',
                                 localeChain: 'fr_FR'
 
diff --git a/resources/views/home/index.blade.php b/resources/views/home/index.blade.php
index 7355131..7f8972d 100644
--- a/resources/views/home/index.blade.php
+++ b/resources/views/home/index.blade.php
@@ -3,14 +3,8 @@
 
 @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">&times;</span>
-                </button>
-            </div>
-        </div>
+        <x-sweetalert title="{!! session('message') !!}" icon="success">
+        </x-sweetalert>
     @endif
 
     @if(session()->has('warning'))
@@ -40,18 +34,18 @@
 
         <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)
@@ -59,40 +53,37 @@
                         </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
@@ -108,10 +99,10 @@
             </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>
@@ -125,12 +116,12 @@
                     <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>
 
diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 8ea0977..8a3eae3 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -16,8 +16,17 @@
             --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>
 
@@ -76,6 +85,8 @@
         <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' : '' }}">
@@ -83,7 +94,7 @@
             <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>
 
@@ -137,6 +148,5 @@
     </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>
diff --git a/resources/views/partials/footer.blade.php b/resources/views/partials/footer.blade.php
index ca41a7c..5705703 100644
--- a/resources/views/partials/footer.blade.php
+++ b/resources/views/partials/footer.blade.php
@@ -1,5 +1,5 @@
 <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>
diff --git a/resources/views/partials/nav-v2.blade.php b/resources/views/partials/nav-v2.blade.php
index 0b15057..854ebbd 100644
--- a/resources/views/partials/nav-v2.blade.php
+++ b/resources/views/partials/nav-v2.blade.php
@@ -1,9 +1,9 @@
-<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>
@@ -13,31 +13,31 @@
 
 </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>
diff --git a/resources/views/presentation/index.blade.php b/resources/views/presentation/index.blade.php
index fa1b271..a068551 100644
--- a/resources/views/presentation/index.blade.php
+++ b/resources/views/presentation/index.blade.php
@@ -4,13 +4,13 @@
 
     <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>
diff --git a/routes/web.php b/routes/web.php
index 9cc6f5b..02d47db 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -86,7 +86,7 @@ Route::domain(env('CLIENT_DOMAIN_NAME'))->group(function() {
 
 
     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');