style(ui): replace dark mode opacity-based colors with explicit hex values

This commit is contained in:
2026-04-22 17:10:53 -04:00
parent bc63618190
commit 0e9f70094d
6 changed files with 25 additions and 24 deletions
+8 -7
View File
@@ -60,7 +60,7 @@ const Table = ({
);
const SkeletonRow = () => (
<tr className="hover:bg-neutral-100 dark:hover:bg-neutral-700/20 transition-colors">
<tr className="hover:bg-neutral-100 dark:hover:bg-neutral-950 transition-colors">
{columns.map((column, index) => (
<td key={index} className={`${sizeClasses.cell} ${column.noWrap !== false ? '' : 'whitespace-nowrap'}`}>
{column.skeleton ? (
@@ -176,7 +176,7 @@ const Table = ({
const to = Math.min(currentPage * limit, total);
const PaginationBar = () => (
<div className="px-4 py-3 border-t border-neutral-200 dark:border-neutral-700/30">
<div className="px-4 py-3 border-t border-neutral-200 dark:border-[#1B1B1B]">
<div className="flex items-center justify-between gap-4">
<div className="flex items-center gap-2 shrink-0">
{loading ? (
@@ -268,7 +268,7 @@ const Table = ({
<div className="hidden lg:block overflow-x-auto">
<table className="w-full">
<thead>
<tr className="border-b border-neutral-200 dark:border-neutral-700/30">
<tr className="border-b border-neutral-200 dark:border-[#1B1B1B]">
{columns.map((column) => (
<th
key={column.key}
@@ -292,16 +292,17 @@ const Table = ({
<EmptyState />
) : (
data.map((item, index) => {
const isLast = index === data.length - 1;
const { className: extraClassName, ...rowExtraProps } = getRowProps ? getRowProps(item) : {};
return (
<tr
key={item.id || index}
className={`hover:bg-neutral-100 dark:hover:bg-neutral-700/20 transition-colors ${onRowClick ? 'cursor-pointer' : ''} ${extraClassName || ''}`}
className={`hover:bg-neutral-50 dark:hover:bg-neutral-950 transition-colors ${onRowClick ? 'cursor-pointer' : ''} ${extraClassName || ''}`}
onClick={onRowClick ? () => onRowClick(item) : undefined}
{...rowExtraProps}
>
{columns.map((column) => (
<td key={column.key} className={`${sizeClasses.cell} ${column.noWrap !== false ? '' : 'whitespace-nowrap'}`}>
{columns.map((column, colIdx) => (
<td key={column.key} className={`${sizeClasses.cell} ${column.noWrap !== false ? '' : 'whitespace-nowrap'} ${isLast && colIdx === 0 ? 'rounded-bl-xl' : ''} ${isLast && colIdx === columns.length - 1 ? 'rounded-br-xl' : ''}`}>
{renderCellContent(item, column)}
</td>
))}
@@ -331,7 +332,7 @@ const Table = ({
return (
<div
key={item.id || index}
className={`${onRowClick ? 'cursor-pointer' : ''} ${extraClassName || ''}`}
className={`${onRowClick ? 'cursor-pointer' : ''} ${extraClassName || ''} ${index === data.length - 1 ? 'rounded-b-xl' : ''}`}
onClick={onRowClick ? () => onRowClick(item) : undefined}
{...rowExtraProps}
>