From 6add698310923c6c2fcc9b9178a7b7d5e1c22ce6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Anthony=20Mah=C3=A9?= <anthony.mahe@dbschenker.com>
Date: Tue, 27 May 2025 09:30:09 +0200
Subject: [PATCH] TEC : Menu sandwish sur la droite

---
 index.html     | 54 +++++++++++++++++++-------------------------------
 navigation.css | 14 ++++++++++---
 2 files changed, 31 insertions(+), 37 deletions(-)

diff --git a/index.html b/index.html
index 6a4a2c3..1a2a5ed 100644
--- a/index.html
+++ b/index.html
@@ -39,16 +39,18 @@
             </div>-->
         </div>
         <div class="navigation">
+            <div class="nav-phone">
+                <div class="logo">
+                    <a href="index.html">
+                        <img src="assets/img/logo.png" alt="Logo - Charline Pasteur Avocate">
+                        <span>Charline Pasteur, Avocate</span>
+                    </a>
+                </div>
+            </div>
             <input class="menu-btn" type="checkbox" id="menu-btn" />
             <label class="menu-icon" for="menu-btn">
                 <span class="navicon"></span>
             </label>
-            <div class="logo">
-                <a href="index.html">
-                    <img src="assets/img/logo.png" alt="Logo - Charline Pasteur Avocate">
-                    <span>Charline Pasteur, Avocate</span>
-                </a>
-            </div>
             <nav class="nav-wrapper" aria-label="Menu principal">
                 <!-- Grand écran : aucun sous-menu -->
                 <ul class="menu" id="menuXL">
@@ -97,45 +99,31 @@
                 <div class="texte">
                     <h2>Spécialiste droit des enfants</h2>
                     <p>Ayant obtenu mon certificat d'aptitude à la profession d'Avocat au sein de l'École de
-                        Formation
-                        du
-                        Barreau à Paris, j'ai débuté mon exercice en tant qu'avocate au sein du Barreau de
-                        Nantes en
-                        janvier
-                        2018.
+                        Formation du Barreau à Paris, j'ai débuté mon exercice en tant qu'avocate au sein du Barreau de
+                        Nantes en janvier 2018.
                         Conformément au serment que j'ai prêté, j'exerce ma profession avec dignité, humanité,
-                        probité,
-                        conscience et indépendance.
+                        probité, conscience et indépendance.
                     </p>
                     <p>Au quotidien, j'ai à cœur de mettre mes compétences au service de causes individuelles
-                        mais aussi
-                        de
-                        causes collectives, le droit étant à mes yeux avant tout un outil au service des droits
+                        mais aussi de causes collectives, le droit étant à mes yeux avant tout un outil au service des
+                        droits
                         humains.
-                        Parmi
-                        ces causes, défendre l'intérêt supérieur de l'enfant et porter leur parole m'animent
+                        Parmi ces causes, défendre l'intérêt supérieur de l'enfant et porter leur parole m'animent
                         particulièrement.
                     </p>
                     <p>La justice des mineurs étant une justice spécialisée, j'ai souhaité me former davantage à
-                        travers
-                        une
-                        année de formation en 2022/2023 auprès de l'Université de Bordeaux m'ayant permis
-                        d'obtenir le
-                        Diplôme
-                        Universitaire « Protection de l'Enfance ».
+                        travers une année de formation en 2022/2023 auprès de l'Université de Bordeaux m'ayant permis
+                        d'obtenir le Diplôme Universitaire « Protection de l'Enfance ».
                     </p>
                     <p>J'ai également obtenu le certificat de spécialisation « Droit des enfants » en décembre
-                        2024 me
-                        permettant aujourd'hui d'exercer comme avocate spécialiste.
+                        2024 me permettant aujourd'hui d'exercer comme avocate spécialiste.
                     </p>
                     <p>Je pratique ainsi les contentieux de l'assistance éducative, du droit pénal des mineurs,
-                        du droit
-                        de la
-                        famille et du droit de l'éducation. J'exerce également dans le domaine du droit des
+                        du droit de la famille et du droit de l'éducation. J'exerce également dans le domaine du droit
+                        des
                         étrangers.
                     </p>
-                    <p>Je suis membre de l'Association de Défense du droit des mineurs à Nantes et j'anime la
-                        commission
+                    <p>Je suis membre de l'Association de Défense du droit des mineurs à Nantes et j'anime la commission
                         mineure du Syndicat des Avocats de France.
                     </p>
                 </div>
@@ -170,8 +158,6 @@
                 </li>
             </ul>
         </section>
-
-
     </main>
 
     <!-- ===== PIED-DE-PAGE ===== -->
diff --git a/navigation.css b/navigation.css
index 9208265..39cc845 100644
--- a/navigation.css
+++ b/navigation.css
@@ -57,11 +57,19 @@ li a:hover::after {
 
 nav {
   margin-left: auto;
+  display: inline-flex;
+  margin-right: 1rem;
+}
+
+.nav-phone{
+  width: 100%;
+  display: flex;
+  width: 100%;
 }
 
 /* === Menus === */
 #menuXL {
-  display: inline-block;
+  display: flex;
 }
 
 /* === Menus === */
@@ -146,7 +154,7 @@ nav {
   }
 
   #menuXL {
-    transform: translateX(-100%);
+    transform: translateX(100%);
     opacity: 0;
     transition: transform 0.3s ease, opacity 0.3s ease;
     max-height: 0;
@@ -157,7 +165,7 @@ nav {
     position: fixed;
     background-color: #F9E7DB;
     top: 3.5rem;
-    left: 0;
+    right: 0;
     box-shadow: 15px 0px 10px rgba(51, 51, 51, 0.15);
   }