diff --git a/resources/views/layouts/unlogged-navigation.blade.php b/resources/views/layouts/unlogged-navigation.blade.php
index 5dfd323..d7f51ac 100644
--- a/resources/views/layouts/unlogged-navigation.blade.php
+++ b/resources/views/layouts/unlogged-navigation.blade.php
@@ -18,7 +18,7 @@
             <x-unlogged-nav-link :href="route('home.index')" :active="request()->routeIs('home.index')">
               {{ __('Accueil') }}
             </x-unlogged-nav-link>
-            <x-unlogged-nav-link :href="route('name.index')" :active="request()->is('name*')">
+            <x-unlogged-nav-link :href="route('name.index')" :active="request()->routeIs('name*')">
               {{ __('Tous les prénoms') }}
             </x-unlogged-nav-link>
           </div>
diff --git a/resources/views/names/female/index.blade.php b/resources/views/names/female/index.blade.php
index c73dd1a..59e81d0 100644
--- a/resources/views/names/female/index.blade.php
+++ b/resources/views/names/female/index.blade.php
@@ -18,7 +18,7 @@
 
   <div>
     <div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-2">
-      <div class="grid name-index-grid">
+      <div class="grid name-index-grid gap-4">
 
         <!-- left -->
         <div>
diff --git a/resources/views/names/female/letter.blade.php b/resources/views/names/female/letter.blade.php
index e9bb290..11e4065 100644
--- a/resources/views/names/female/letter.blade.php
+++ b/resources/views/names/female/letter.blade.php
@@ -21,7 +21,7 @@
 
   <div>
     <div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-2">
-      <div class="grid name-index-grid">
+      <div class="grid name-index-grid gap-4">
 
         <!-- left -->
         <div>
diff --git a/resources/views/names/index.blade.php b/resources/views/names/index.blade.php
index 4fe9380..6a8897c 100644
--- a/resources/views/names/index.blade.php
+++ b/resources/views/names/index.blade.php
@@ -18,7 +18,7 @@
 
   <div>
     <div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-2">
-      <div class="grid name-index-grid">
+      <div class="grid name-index-grid gap-4">
 
         <!-- left -->
         <div>
diff --git a/resources/views/names/letter.blade.php b/resources/views/names/letter.blade.php
index 8f783fa..a3cd2a3 100644
--- a/resources/views/names/letter.blade.php
+++ b/resources/views/names/letter.blade.php
@@ -21,7 +21,7 @@
 
   <div>
     <div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-2">
-      <div class="grid name-index-grid">
+      <div class="grid name-index-grid gap-4">
 
         <!-- left -->
         <div>
diff --git a/resources/views/names/male/index.blade.php b/resources/views/names/male/index.blade.php
index 01e7f86..baf2138 100644
--- a/resources/views/names/male/index.blade.php
+++ b/resources/views/names/male/index.blade.php
@@ -18,7 +18,7 @@
 
   <div>
     <div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-2">
-      <div class="grid name-index-grid">
+      <div class="grid name-index-grid gap-4">
 
         <!-- left -->
         <div>
diff --git a/resources/views/names/male/letter.blade.php b/resources/views/names/male/letter.blade.php
index 151da7b..66ac01a 100644
--- a/resources/views/names/male/letter.blade.php
+++ b/resources/views/names/male/letter.blade.php
@@ -21,7 +21,7 @@
 
   <div>
     <div class="mx-auto max-w-7xl sm:px-6 lg:px-8 py-2">
-      <div class="grid name-index-grid">
+      <div class="grid name-index-grid gap-4">
 
         <!-- left -->
         <div>
diff --git a/resources/views/names/partials/sidebar.blade.php b/resources/views/names/partials/sidebar.blade.php
index af19658..98b4551 100644
--- a/resources/views/names/partials/sidebar.blade.php
+++ b/resources/views/names/partials/sidebar.blade.php
@@ -1,14 +1,14 @@
-<ul>
-  <li>
+<ul class="space-y-1">
+  <li class="p-2 border {{ request()->routeIs('name.index') ? 'bg-yellow-100 border-yellow-200' : 'border-transparent' }} hover:bg-yellow-100 hover:border-yellow-200 rounded-md">
     <a href="{{ route('name.index') }}">Tous les prénoms</a>
   </li>
-  <li>
+  <li class="p-2 border {{ request()->routeIs('name.garcon.index') ? 'bg-yellow-100 border-yellow-200' : 'border-transparent' }} hover:bg-yellow-100 hover:border-yellow-200 rounded-md">
     <a href="{{ route('name.garcon.index') }}">Prénoms masculins</a>
   </li>
-  <li>
+  <li class="p-2 border {{ request()->routeIs('name.fille.index') ? 'bg-yellow-100 border-yellow-200' : 'border-transparent' }} hover:bg-yellow-100 hover:border-yellow-200 rounded-md">
     <a href="{{ route('name.fille.index') }}">Prénoms féminins</a>
   </li>
-  <li>
+  <li class="p-2 border {{ request()->routeIs('name.') ? 'bg-yellow-100 border-yellow-200' : 'border-transparent' }} hover:bg-yellow-100 hover:border-yellow-200 rounded-md">
     <a href="{{ route('name.garcon.index') }}">Prénoms mixtes</a>
   </li>
 </ul>