Fix Column selector visibility and z-index

This commit is contained in:
christian.vidal
2026-01-29 18:50:46 +01:00
parent 367440fa6b
commit 815c9bc934
+4 -4
View File
@@ -700,10 +700,10 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData, s
)}
{/* 2. Controls & Grid */}
<div className="bg-surface border border-border rounded-xl shadow-lg overflow-hidden flex flex-col">
<div className="bg-surface border border-border rounded-xl shadow-lg flex flex-col">
{/* Toolbar */}
<div className="p-4 border-b border-border bg-slate-900/50 flex flex-col lg:flex-row gap-4 justify-between items-start lg:items-center">
<div className="p-4 border-b border-border bg-slate-900/50 flex flex-col lg:flex-row gap-4 justify-between items-start lg:items-center rounded-t-xl">
<div className="flex flex-wrap items-center gap-3 w-full lg:w-auto">
{/* Dimensions Selector */}
@@ -720,7 +720,7 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData, s
<svg className={`w-3.5 h-3.5 transition-transform duration-200 ${showDimensionMenu ? 'rotate-180 text-white' : 'text-slate-500'}`} fill="none" viewBox="0 0 24 24" strokeWidth={2.5} stroke="currentColor"><path strokeLinecap="round" strokeLinejoin="round" d="m19.5 8.25-7.5 7.5-7.5-7.5" /></svg>
</button>
{showDimensionMenu && (
<div className="absolute top-full left-0 mt-2 w-64 bg-slate-900 border border-slate-700 rounded-xl shadow-[0_20px_50px_rgba(0,0,0,0.5)] p-3 animate-fade-in z-50 ring-1 ring-white/10">
<div className="absolute top-full left-0 mt-2 w-64 bg-slate-900 border border-slate-700 rounded-xl shadow-[0_20px_50px_rgba(0,0,0,0.5)] p-3 animate-fade-in z-[100] ring-1 ring-white/10">
<div className="flex justify-between items-center mb-3 px-1">
<span className="text-[11px] font-black text-slate-500 uppercase tracking-[0.2em]">Select Columns</span>
<button
@@ -1209,7 +1209,7 @@ const DataGrid: React.FC<DataGridProps> = ({ data, hasCustomerFilter, adsData, s
</div>
{/* Pagination */}
<div className="p-4 border-t border-border bg-slate-900/50 flex flex-col sm:flex-row justify-between items-center gap-4">
<div className="p-4 border-t border-border bg-slate-900/50 flex flex-col sm:flex-row justify-between items-center gap-4 rounded-b-xl">
<div className="text-sm text-slate-500">
Page {currentPage} of {totalPages || 1}
</div>