style(ui): replace dark mode opacity-based colors with explicit hex values
This commit is contained in:
@@ -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}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user