From 577746bd299f791b915661c0e21e7dd41f04cde5 Mon Sep 17 00:00:00 2001 From: Nicolas Date: Sun, 30 Jun 2024 14:14:33 +0200 Subject: [PATCH] responsive docs divers + boutique :100: --- src/js/Components/footer/InfosPratiques.jsx | 2 +- src/js/Pages/Boutique/Boutique.jsx | 4 +- src/sass/divers.scss | 123 +++++++++++++++++++- 3 files changed, 125 insertions(+), 4 deletions(-) diff --git a/src/js/Components/footer/InfosPratiques.jsx b/src/js/Components/footer/InfosPratiques.jsx index 34e5293..0572e54 100644 --- a/src/js/Components/footer/InfosPratiques.jsx +++ b/src/js/Components/footer/InfosPratiques.jsx @@ -4,7 +4,7 @@ export default function InfosPratiques() { return ( <>
-

INFOS PRATIQUES

+

INFOS PRATIQUES

Caen Volley Ball

Centre Sportif La Haie Vigné, 135 Rue de Bayeux

14000 Caen

diff --git a/src/js/Pages/Boutique/Boutique.jsx b/src/js/Pages/Boutique/Boutique.jsx index f8a7bfa..7ffd680 100644 --- a/src/js/Pages/Boutique/Boutique.jsx +++ b/src/js/Pages/Boutique/Boutique.jsx @@ -37,12 +37,12 @@ export default function Boutique( {auth}) { " />
- dimensions veste zippée

Dimensions Veste zippée

+ dimensions maillot et short
- dimensions maillot et short

Dimensions Maillot + Short

+ dimensions veste zippée
diff --git a/src/sass/divers.scss b/src/sass/divers.scss index 4fccec0..739c13f 100644 --- a/src/sass/divers.scss +++ b/src/sass/divers.scss @@ -267,5 +267,126 @@ section{ /* Media queries pour appareils mobiles */ @media (max-width: 480px) { - + section{ + img{ + width: 100%; + min-width: 320px; + max-width: 480px; + } + h1{ + white-space: pre-wrap !important; + margin: 3%; + font-size: $sizeTitleMobile !important; + } + .planning, .organigramme, .historique, .reglement, .statuts, .tarifs, .mode-emploi-icence, .devenez-partenaire{ + margin: 10% 0%; + display: flex; + justify-content: center; + } + .reglement, .statuts, .tarifs, .mode-emploi-icence, .devenez-partenaire{ + border-bottom: solid 1px rgb(153, 153, 153); + } + .projet{ + margin: 0 auto; + width: 100%; + .intro{ + padding: 3% 5%; + p{ + text-align: justify; + line-height: 1.5; + font-size: 16px; + } + } + .projet-content{ + margin-top: 5%; + h3{ + text-align: left; + margin: 2% 5%; + } + h4{ + text-align: justify; + margin: 2% 5%; + } + p{ + padding: 0 5%; + line-height: 1.5; + text-align: justify; + } + } + } + .docs-divers{ + margin-bottom: 3%; + ul{ + flex-direction: column; + flex-wrap: nowrap; + gap: 0; + li{ + margin-top: 3%; + text-align: center; + iframe{ + margin: 0 auto; + width: 95%; + height: 350px; + } + } + p{ + width: 60%; + font-size: 16px; + } + } + } + } + // _____________________________ Boutique ________________________ + + .boutique{ + width: 95%; + .intro{ + h3{ + font-size: 22px; + } + p{ + text-align: justify; + line-height: 1.5; + font-size: 16px; + } + } + .riva-floc{ + margin-top: 5%; + h2{ + font-size: 22px; + } + p{ + font-size: 16px; + } + img{ + max-width: 480px; + } + } + .ak-seven{ + h2{ + font-size: 22px; + } + p{ + font-size: 16px; + } + img{ + margin: 0 auto; + max-width: 480px; + width: 95%; + } + .bon-commande{ + margin-top: 10%; + max-width: 480px; + } + .bloc-tailles{ + margin-top: 10%; + display: flex; + flex-direction: column; + justify-content: center; + h3{ + font-size: 20px; + } + } + } + } } \ No newline at end of file