From 0770c74ba240e203fba52b54fcfd5a0506ff626b Mon Sep 17 00:00:00 2001
From: Matteo <matteo@yuno.malio.fr>
Date: Mon, 9 Feb 2026 13:26:41 +0100
Subject: [PATCH] fix : panel scrollable plus interface revue

---
 frontend/pages/admin/carrier/carrier-list.vue |  2 +-
 .../pages/admin/supplier/supplier-list.vue    | 79 ++++++++++---------
 2 files changed, 42 insertions(+), 39 deletions(-)

diff --git a/frontend/pages/admin/carrier/carrier-list.vue b/frontend/pages/admin/carrier/carrier-list.vue
index 7e67345..082763b 100644
--- a/frontend/pages/admin/carrier/carrier-list.vue
+++ b/frontend/pages/admin/carrier/carrier-list.vue
@@ -4,7 +4,7 @@
             <h1 class="text-3xl font-bold uppercase">listes des transporteurs</h1>
             <button
                 @Click="goToCarrier()"
-                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] justify-self-end"
+                class="text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px] "
             >Ajouter
             </button>
     </div>
diff --git a/frontend/pages/admin/supplier/supplier-list.vue b/frontend/pages/admin/supplier/supplier-list.vue
index d0a9f6d..7840c65 100644
--- a/frontend/pages/admin/supplier/supplier-list.vue
+++ b/frontend/pages/admin/supplier/supplier-list.vue
@@ -1,49 +1,52 @@
 <template>
-    <div class="flex items-center justify-between p-4">
+    <div class="flex items-center justify-between">
         <h1 class="text-3xl font-bold uppercase"> Fournisseurs </h1>
         <NuxtLink to="/admin/supplier"
-           class="flex items-center justify-center uppercase text-xl bg-primary-500 text-white h-[50px] w-[272px]"
+                  class="flex items-center justify-center text-xl uppercase bg-primary-500 text-white h-[50px] w-[272px]"
         >
-            Ajouter </NuxtLink>
+            Ajouter
+        </NuxtLink>
     </div>
     <div class="mt-6 border border-slate-200 mb-16">
-        <div
-            class="grid grid-cols-6 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
-        >
-            <div>Nom</div>
-            <div>Mail</div>
-            <div>Rue</div>
-            <div>Complément</div>
-            <div>Code Postal</div>
-            <div>Ville</div>
-        </div>
+        <div class="max-h-96 overflow-y-auto">
+            <div
+                class="sticky top-0 z-10 grid grid-cols-6 gap-4 bg-slate-100 px-4 py-3 text-sm font-semibold uppercase tracking-wide"
+            >
+                <div>Nom</div>
+                <div>Mail</div>
+                <div>Rue</div>
+                <div>Complément</div>
+                <div>Code Postal</div>
+                <div>Ville</div>
+            </div>
 
-        <div v-for="supplier in supplierList" :key="supplier.id">
-            <template v-if="supplier.addresses?.length">
-                <div
-                    v-for="addr in supplier.addresses"
-                    :key="addr.id"
-                    class="grid grid-cols-6 gap-4 px-4 py-2"
-                    @click="goToSupplier(supplier.id)"
-                >
-                    <div class="truncate">
-                        {{ supplier.name }}
+            <div v-for="supplier in supplierList" :key="supplier.id">
+                <template v-if="supplier.addresses?.length">
+                    <div
+                        v-for="addr in supplier.addresses"
+                        :key="addr.id"
+                        class="grid grid-cols-6 hover:bg-slate-50 border-t gap-4 px-4 py-2"
+                        @click="goToSupplier(supplier.id)"
+                    >
+                        <div class="truncate">
+                            {{ supplier.name }}
+                        </div>
+                        <div class="truncate">
+                            {{ supplier.email }}
+                        </div>
+                        <div class="truncate">
+                            {{ addr.street }}
+                        </div>
+                        <div class="truncate">
+                            {{ addr.street2 }}
+                        </div>
+                        <div>{{ addr.postalCode }}</div>
+                        <div class="uppercase truncate">
+                            {{ addr.city }}
+                        </div>
                     </div>
-                    <div class="truncate">
-                        {{ supplier.email }}
-                    </div>
-                    <div class="truncate">
-                        {{ addr.street }}
-                    </div>
-                    <div class="truncate">
-                        {{ addr.street2 }}
-                    </div>
-                    <div>{{ addr.postalCode }}</div>
-                    <div class="uppercase truncate">
-                        {{ addr.city }}
-                    </div>
-                </div>
-            </template>
+                </template>
+            </div>
         </div>
     </div>
 </template>