nav début

src/app/pages/menu/menu-nav/menu-nav.component.html

@@ -5,3 +5,36 @@
                 <path d="M56,48c2.209,0 4,1.791 4,4c0,2.209 -1.791,4 -4,4c-1.202,0 -38.798,0 -40,0c-2.209,0 -4,-1.791 -4,-4c0,-2.209 1.791,-4 4,-4c1.202,0 38.798,0 40,0zM56,32c2.209,0 4,1.791 4,4c0,2.209 -1.791,4 -4,4c-1.202,0 -38.798,0 -40,0c-2.209,0 -4,-1.791 -4,-4c0,-2.209 1.791,-4 4,-4c1.202,0 38.798,0 40,0zM56,16c2.209,0 4,1.791 4,4c0,2.209 -1.791,4 -4,4c-1.202,0 -38.798,0 -40,0c-2.209,0 -4,-1.791 -4,-4c0,-2.209 1.791,-4 4,-4c1.202,0 38.798,0 40,0z"></path></g></g>
     </svg>
 </button>
+
+<ion-modal [isOpen]="isModalOpen()" (didDismiss)="closeNav()">
+    <ng-template>
+        <div class="modal-layout">
+
+            <div class="modal-header">
+                <h2 class="modal-title">Nouvelle conversation</h2>
+                <button class="modal-close-btn" (click)="closeNav()">
+                    <ion-icon name="close-outline" />
+                </button>
+            </div>
+
+            <div class="modal-body">
+                <div class="input-wrapper">
+                    <ion-item class="custom-item">
+                        <ion-input
+                                label="Nom d'utilisateur"
+                                labelPlacement="floating"
+                                placeholder="ex: jean_dupont"
+                        />
+                    </ion-item>
+                    <!-- message d'erreur — affiché plus tard via logique -->
+                    <!-- <p class="error-msg">Utilisateur introuvable.</p> -->
+                </div>
+
+                <button class="submit-btn">
+                    Démarrer la conversation
+                </button>
+            </div>
+
+        </div>
+    </ng-template>
+</ion-modal>