Ajustement de la Navbar

src/lib/components/NavBar.svelte

@@ -22,9 +22,9 @@
 </script>
 
 <div class="fixed top-0 w-full z-50">
-  <nav class="bg-le-jaune h-14 shadow-md mx-auto px-2 sm:px-6 lg:px-8 w-full">
+  <nav class="bg-le-jaune h-14 shadow-md mx-auto px-4 lg:px-8 w-full">
     <!-- Création d'un div sur l'ensemble de la nav bar pour répartir les blocs-->
-    <div class="hidden sm:flex  justify-between">
+    <div class="hidden md:flex  justify-between">
       <!-- Premier div pour le logo AN et le menu A propos-->
       <div class="flex w-64 items-center">
         <!-- logo assemblee nationale -->
@@ -120,7 +120,7 @@
       </div>
 
       <!-- Deuxième div pour le logo Contrib. & prestas sociales-->
-      <div class="hidden sm:flex">
+      <div class="hidden md:flex">
         <a href="/">
           <div
             class="space-y-1 flex items-center h-14 gap-2 rounded text-white p-1"
@@ -144,7 +144,7 @@
         <div class="flex">
           <a
             href="/contribuer"
-            class="hidden sm:inline-flex text-white uppercase text-sm rounded-sm focus:outline-none  hover:bg-gray-400 hover:bg-opacity-20 hover:text-white p-1"
+            class="hidden md:inline-flex text-white uppercase text-sm rounded-sm focus:outline-none  hover:bg-gray-400 hover:bg-opacity-20 hover:text-white p-1"
             type="button"
           >
             <div class="flex items-center">
@@ -271,7 +271,7 @@
 
     <!--Menu écran téléphone-->
 
-    <div class="sm:hidden flex justify-between items-center">
+    <div class="md:hidden flex justify-between items-center">
       <!-- Premier div pour le logo AN et le menu A propos-->
       <div class="w-16">
         <!-- logo assemblee nationale -->
@@ -299,11 +299,11 @@
       </div>
 
       <!-- Troisième div pour le bouton menu-->
-      <div class="w-16 ">
+      <div class="w-16 flex justify-end">
         <button
           aria-expanded={openAproposMenu}
           aria-haspopup="true"
-          class="text-white uppercase text-sm rounded-sm focus:outline-none  hover:bg-gray-400 hover:bg-opacity-20 hover:text-white p-1"
+          class="text-white uppercase text-sm rounded-sm focus:outline-none  hover:bg-gray-400 hover:bg-opacity-20 hover:text-white p-1 justify-self-end"
           id="user-menu"
           on:click={() => (openAproposMenu = !openAproposMenu)}
           type="button"
@@ -311,7 +311,7 @@
           <span class="sr-only">Open user menu</span>
           <!-- Material icon : menu -->
           <svg
-            class="sm:hidden fill-current text-white"
+            class="md:hidden fill-current text-white"
             xmlns="http://www.w3.org/2000/svg"
             height="24px"
             viewBox="0 0 24 24"