ConceptProd/ConceptPortal-public
1
0
Fork 0
mirror of https://github.com/IRBorisov/ConceptPortal.git synced 2025-06-27 05:20:36 +03:00
Code Issues Actions Packages Projects Releases Wiki Activity

M: Improve table styling
Some checks are pending
Frontend CI / build (22.x) (push) Waiting to run
Details

Browse Source
This commit is contained in:
Ivan 2025-03-12 23:39:11 +03:00
parent 8d304f32d0
commit 26976c806a
3 changed files with 9 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
rsconcept/frontend/src/components/data-table/data-table.tsx
View File

@ -10,6 +10,7 @@ import {
type TableOptions, type TableOptions,
type VisibilityState type VisibilityState
} from '@tanstack/react-table'; } from '@tanstack/react-table';
import clsx from 'clsx';
import { type Styling } from '../props'; import { type Styling } from '../props';
@ -152,7 +153,12 @@ export function DataTable<TData extends RowData>({
}, [table]); }, [table]);
return ( return (
<div tabIndex={-1} id={id} className={className} style={{ minHeight: fixedSize, maxHeight: fixedSize, ...style }}> <div
tabIndex={-1}
id={id}
className={clsx('table-auto', className)}
style={{ minHeight: fixedSize, maxHeight: fixedSize, ...style }}
>
<table className='w-full' style={{ ...columnSizeVars }}> <table className='w-full' style={{ ...columnSizeVars }}>
{!noHeader ? ( {!noHeader ? (
<TableHeader table={table} headPosition={headPosition} resetLastSelected={() => setLastSelected(null)} /> <TableHeader table={table} headPosition={headPosition} resetLastSelected={() => setLastSelected(null)} />

2
rsconcept/frontend/src/components/data-table/sorting-icon.tsx
View File

@ -11,5 +11,5 @@ export function SortingIcon({ sortDirection }: SortingIconProps) {
if (sortDirection === 'desc') { if (sortDirection === 'desc') {
return <IconSortDesc size='1rem' />; return <IconSortDesc size='1rem' />;
} }
return <IconSortDesc size='1rem' className='opacity-0 group-hover:opacity-25' />; return <IconSortDesc size='1rem' className='opacity-0 group-hover:opacity-25 transition-opacity' />;
} }

2
rsconcept/frontend/src/components/data-table/table-body.tsx
View File

@ -98,7 +98,7 @@ export function TableBody<TData>({
cursor: onRowClicked || onRowDoubleClicked ? 'pointer' : 'auto', cursor: onRowClicked || onRowDoubleClicked ? 'pointer' : 'auto',
paddingBottom: dense ? '0.25rem' : '0.5rem', paddingBottom: dense ? '0.25rem' : '0.5rem',
paddingTop: dense ? '0.25rem' : '0.5rem', paddingTop: dense ? '0.25rem' : '0.5rem',
width: noHeader && index === 0 ? `calc(var(--col-${cell.column.id}-size) * 1px)` : 'auto' width: noHeader && index === 0 ? `calc(var(--col-${cell.column.id}-size) * 1px)` : undefined
}} }}
> >
{flexRender(cell.column.columnDef.cell, cell.getContext())} {flexRender(cell.column.columnDef.cell, cell.getContext())}