From 4cc8134e96cbb442f6f6b1c178e5c9f5342072ad Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?J=C3=A9r=C3=A9my=20Munsch?= <jeremy.munsch@ldc.fr>
Date: Mon, 23 Oct 2023 10:51:39 +0200
Subject: [PATCH] footer desktop ok

---
 resources/sass/fo/base/_fonts.scss          |  3 +-
 resources/sass/fo/base/_layout.scss         | 34 +++++++++++++++++++++
 resources/views/fo/layouts/footer.blade.php | 20 ++++++------
 3 files changed, 46 insertions(+), 11 deletions(-)

diff --git a/resources/sass/fo/base/_fonts.scss b/resources/sass/fo/base/_fonts.scss
index a276cfe..d8c4b89 100644
--- a/resources/sass/fo/base/_fonts.scss
+++ b/resources/sass/fo/base/_fonts.scss
@@ -53,11 +53,12 @@
 }
 
 @font-face {
+    ascent-override: 105%;
     font-display: swap;
     font-family: Sheldon;
     font-style: normal;
     font-weight: 500;
-    size-adjust: 160%;
+    size-adjust: 150%;
     src: url('@/fonts/Sheldon.woff2') format('woff2'),
         url('@/fonts/Sheldon.woff') format('woff');
 }
diff --git a/resources/sass/fo/base/_layout.scss b/resources/sass/fo/base/_layout.scss
index 7c4324e..56e79e0 100644
--- a/resources/sass/fo/base/_layout.scss
+++ b/resources/sass/fo/base/_layout.scss
@@ -69,6 +69,15 @@
         .row {
             padding: 2rem 0;
 
+            &:nth-child(1) {
+                padding-top: 3rem;
+                padding-bottom: 0;
+
+                img {
+                    width: 7rem;
+                }
+            }
+
             &:nth-child(2),&:nth-child(3) {
                 padding-bottom: 3rem;
                 background-image: url('@/images/layout/footer-h-bar.svg');
@@ -80,6 +89,25 @@
             &:nth-child(3) {
                 padding-bottom: 5rem;
                 background-position: center 92%;
+
+                @include media-breakpoint-up(lg) {
+                    padding-top: 0;
+                    padding-bottom: 1rem;
+                }
+
+                > div:nth-child(1) {
+                    background-image: url('@/images/layout/footer-v-bar.svg');
+                    background-position: right center;
+                    background-repeat: no-repeat;
+                    background-size: .3rem 100%;
+                }
+
+                > div:nth-child(3) {
+                    background-image: url('@/images/layout/footer-v-bar.svg');
+                    background-position: left center;
+                    background-repeat: no-repeat;
+                    background-size: .3rem 100%;
+                }
             }
         }
     }
@@ -90,6 +118,12 @@
 
     .social-icon {
         width: 4rem;
+        padding: 0 1rem;
+
+        @include media-breakpoint-up(lg) {
+            width: 2.2rem;
+            padding:0;
+        }
     }
 
     a,span {
diff --git a/resources/views/fo/layouts/footer.blade.php b/resources/views/fo/layouts/footer.blade.php
index 1a62d1e..2dbe0ea 100644
--- a/resources/views/fo/layouts/footer.blade.php
+++ b/resources/views/fo/layouts/footer.blade.php
@@ -1,15 +1,15 @@
 <footer class="main-footer p-3">
     <div class="container-fluid">
         <div class="row">
-            <div class="col-3 d-none">
+            <div class="col-3 d-none d-lg-block text-end">
                 <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/layout/footer-left-logo.svg') }}"
                     alt="{{ __('Départ, Inspiration Asie') }}" />
             </div>
-            <div class="col-12 col-md-6 footer-header text-center">
+            <div class="col-12 col-lg-6 footer-header text-center">
                 <div class="h1 text-uppercase f-sheldon">{{ __('Envie d\'exploration') }}</div>
                 <div class="h2 text-uppercase f-sheldon">{{ __('Suivez-nous sur') }}</div>
             </div>
-            <div class="col-3 d-none">
+            <div class="col-3 d-none d-lg-block text-start">
                 <img class="img-fluid" src="{{ Vite::asset('resources/assets/images/layout/footer-right-logo.svg') }}"
                     alt="{{ __('Départ, Inspiration Italie') }}" />
             </div>
@@ -17,29 +17,29 @@
         <div class="row">
             <div class="col text-center">
                 <a href="#FIXME:Change this" title="{{ __('Nous suivre sur Instagram') }}" target="_blank">
-                    <img class="social-icon img-fluid px-3" src="{{ Vite::asset('resources/assets/images/socials/instagram-logo.svg') }}"
+                    <img class="social-icon img-fluid" src="{{ Vite::asset('resources/assets/images/socials/instagram-logo.svg') }}"
                         alt="{{ __('Instagram') }}">
                 </a>
                 <a href="#FIXME:Change this" title="{{ __('Nous suivre sur Facebook') }}" target="_blank">
-                    <img class="social-icon img-fluid px-3" src="{{ Vite::asset('resources/assets/images/socials/facebook-logo.svg') }}"
+                    <img class="social-icon img-fluid" src="{{ Vite::asset('resources/assets/images/socials/facebook-logo.svg') }}"
                         alt="{{ __('Facebook') }}">
                 </a>
                 <a href="#FIXME:Change this" title="{{ __('Nous suivre sur Linkedin') }}" target="_blank">
-                    <img class="social-icon img-fluid px-3" src="{{ Vite::asset('resources/assets/images/socials/linkedin-logo.svg') }}"
+                    <img class="social-icon img-fluid" src="{{ Vite::asset('resources/assets/images/socials/linkedin-logo.svg') }}"
                         alt="{{ __('Linkedin') }}">
                 </a>
             </div>
         </div>
         <div class="row">
-            <div class="col-12">
+            <div class="col-12 col-lg-3 p-lg-3">
                 <address class="d-flex flex-column">
-                    <span class="text-uppercase">Siège Social Agis</span>
+                    <span class="text-uppercase fw-bold">Siège Social Agis</span>
                     <span class="text-uppercase">802 Rue Sainte-Geneviève</span>
                     <span class="text-uppercase">84000 Avignon</span>
                     <a class="link-dark text-uppercase" href="tel:+33490809999">T. +33 (0)4 90 80 99 99</a>
                 </address>
             </div>
-            <div class="col-12 d-flex flex-column">
+            <div class="col-12 col-lg-6 d-flex flex-column flex-lg-row justify-content-around p-lg-3">
                 <ul class="navbar-nav">
                     <li class="nav-item">
                         <a class="nav-link text-uppercase @if (request()->routeIs('fo.homepage')) active @endif" data-bs-toggle="tooltip"
@@ -99,7 +99,7 @@
                     </li>
                 </ul>
             </div>
-            <div class="col-12 d-flex flex-column text-uppercase">
+            <div class="col-12 col-lg-3 d-flex flex-column text-uppercase p-lg-3">
                 <span>{{ __('Branding & Web Design :') }}</span>
                 <span>{{ __('Agence-S') }}</span>
             </div>