vega-frontend-monorepo/apps/trading/components/fees-container/table.tsx

51 lines
1.2 KiB
TypeScript
Raw Normal View History

2023-10-25 21:59:30 +00:00
import classNames from 'classnames';
import type { ReactNode } from 'react';
const cellClass = 'px-4 py-2 text-xs font-normal text-left last:text-right';
2023-12-19 12:22:15 +00:00
export const Th = ({ children, ...props }: { children?: ReactNode }) => {
2023-10-25 21:59:30 +00:00
return (
2023-12-19 12:22:15 +00:00
<th
className={classNames(cellClass, 'text-secondary leading-none py-3')}
{...props}
>
2023-10-25 21:59:30 +00:00
{children}
</th>
);
};
2023-12-19 12:22:15 +00:00
export const Td = ({ children, ...props }: { children?: ReactNode }) => {
return (
<th className={cellClass} {...props}>
{children}
</th>
);
2023-10-25 21:59:30 +00:00
};
2023-12-19 12:22:15 +00:00
export const Tr = ({ children, ...props }: { children?: ReactNode }) => {
2023-10-25 21:59:30 +00:00
return (
2023-12-19 12:22:15 +00:00
<tr
className="hover:bg-vega-clight-600 dark:hover:bg-vega-cdark-700"
{...props}
>
2023-10-25 21:59:30 +00:00
{children}
</tr>
);
};
export const Table = ({ children }: { children: ReactNode }) => {
return (
<table className="w-full border border-separate rounded-sm border-spacing-0 border-vega-clight-600 dark:border-vega-cdark-600">
{children}
</table>
);
};
export const THead = ({ children }: { children: ReactNode }) => {
return (
<thead className="border-b bg-vega-clight-700 dark:bg-vega-cdark-700 border-vega-clight-600 dark:border-vega-cdark-600">
{children}
</thead>
);
};