footer desktop ok

This commit is contained in:
Jérémy Munsch 2023-10-23 10:51:39 +02:00
parent 5220fc130f
commit 4cc8134e96
No known key found for this signature in database
GPG key ID: 18361AF3BFEC0FEC
3 changed files with 46 additions and 11 deletions

View file

@ -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');
}

View file

@ -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 {

View file

@ -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>