Daniel/webshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(admin): improve address hover contrast in company tables

Browse Source
This commit is contained in:
DanielS
2026-08-18 16:16:01 +02:00
parent 1c8de6e895
commit 037e6d749a
2 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
shop/app/admin/companies/[id]/customers/page.tsx
View File

@@ -245,32 +245,32 @@ export default function CompanyCustomersPage() {
</thead> </thead>
<tbody className="divide-y divide-slate-100 dark:divide-white/5"> <tbody className="divide-y divide-slate-100 dark:divide-white/5">
{filteredCustomers.map((customer) => ( {filteredCustomers.map((customer) => (
<tr key={customer.id} className="hover:bg-slate-50 dark:hover:bg-white/3 transition-colors"> <tr key={customer.id} className="hover:bg-slate-100 dark:hover:bg-white/10 transition-colors group">
<td className="py-4"> <td className="py-4">
<div className="font-semibold text-slate-900 dark:text-white"> <div className="font-semibold text-slate-900 dark:text-white">
{customer.company_name} {customer.company_name}
</div> </div>
{(customer.first_name || customer.last_name) && ( {(customer.first_name || customer.last_name) && (
<div className="text-xs text-slate-500 dark:text-slate-400 flex items-center gap-1 mt-0.5"> <div className="text-xs text-slate-600 dark:text-slate-300 font-medium flex items-center gap-1 mt-0.5">
<User className="w-3 h-3 text-slate-400 shrink-0" /> <User className="w-3 h-3 text-indigo-500 dark:text-indigo-400 shrink-0" />
<span>{customer.first_name || ''} {customer.last_name || ''}</span> <span>{customer.first_name || ''} {customer.last_name || ''}</span>
</div> </div>
)} )}
</td> </td>
<td className="py-4 text-sm text-slate-700 dark:text-slate-300"> <td className="py-4 text-sm text-slate-800 dark:text-slate-100 font-medium">
{customer.street ? ( {customer.street ? (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<MapPin className="w-3.5 h-3.5 text-slate-400 shrink-0" /> <MapPin className="w-3.5 h-3.5 text-indigo-500 dark:text-indigo-400 shrink-0" />
<span> <span>
{customer.street}, {customer.zip} {customer.city} {customer.street}, {customer.zip} {customer.city}
</span> </span>
</div> </div>
) : ( ) : (
<span className="text-slate-400 dark:text-slate-600">–</span> <span className="text-slate-400 dark:text-slate-500">–</span>
)} )}
</td> </td>
<td className="py-4 text-sm text-slate-700 dark:text-slate-300"> <td className="py-4 text-sm text-slate-800 dark:text-slate-100 font-medium">
{customer.email || <span className="text-slate-400 dark:text-slate-600">–</span>} {customer.email || <span className="text-slate-400 dark:text-slate-500">–</span>}
</td> </td>
<td className="py-4 text-sm text-slate-700 dark:text-slate-300"> <td className="py-4 text-sm text-slate-700 dark:text-slate-300">
{customer.vat_id || <span className="text-slate-400 dark:text-slate-600">–</span>} {customer.vat_id || <span className="text-slate-400 dark:text-slate-600">–</span>}

12
shop/app/admin/companies/page.tsx
View File

@@ -197,25 +197,25 @@ export default function CompaniesPage() {
</thead> </thead>
<tbody className="divide-y divide-slate-100 dark:divide-white/5"> <tbody className="divide-y divide-slate-100 dark:divide-white/5">
{filteredCompanies.map((company) => ( {filteredCompanies.map((company) => (
<tr key={company.id} className="hover:bg-slate-50 dark:hover:bg-white/3 transition-colors"> <tr key={company.id} className="hover:bg-slate-100 dark:hover:bg-white/10 transition-colors group">
<td className="py-4 font-semibold text-slate-900 dark:text-white"> <td className="py-4 font-semibold text-slate-900 dark:text-white">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Building2 className="w-4 h-4 text-blue-500 shrink-0" /> <Building2 className="w-4 h-4 text-blue-500 dark:text-blue-400 shrink-0" />
{company.name} {company.name}
</div> </div>
</td> </td>
<td className="py-4 text-sm text-slate-700 dark:text-slate-300"> <td className="py-4 text-sm text-slate-800 dark:text-slate-100 font-medium">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<MapPin className="w-3.5 h-3.5 text-slate-400 shrink-0" /> <MapPin className="w-3.5 h-3.5 text-blue-500 dark:text-blue-400 shrink-0" />
<span> <span>
{company.street ? `${company.street}, ${company.zip} ${company.city}` : '–'} {company.street ? `${company.street}, ${company.zip} ${company.city}` : '–'}
</span> </span>
</div> </div>
</td> </td>
<td className="py-4 text-sm text-slate-700 dark:text-slate-300"> <td className="py-4 text-sm text-slate-800 dark:text-slate-100 font-medium">
{company.email ? ( {company.email ? (
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<Mail className="w-3.5 h-3.5 text-slate-400 shrink-0" /> <Mail className="w-3.5 h-3.5 text-blue-500 dark:text-blue-400 shrink-0" />
<span>{company.email}</span> <span>{company.email}</span>
</div> </div>
) : '–'} ) : '–'}