Fix table name overflow

This commit is contained in:
1ilit 2024-04-01 20:57:13 +03:00
parent 19ca8a55c2
commit d9fa03ae01

View File

@ -81,22 +81,16 @@ export default function Table(props) {
}`} }`}
> >
<div <div
className={`h-[10px] w-full rounded-t-md`} className="h-[10px] w-full rounded-t-md"
style={{ backgroundColor: props.tableData.color }} style={{ backgroundColor: props.tableData.color }}
/> />
<div <div
className={`font-bold h-[40px] flex justify-between items-center border-b border-gray-400 ${ className={`overflow-hidden font-bold h-[40px] flex justify-between items-center border-b border-gray-400 ${
settings.mode === "light" ? "bg-zinc-200" : "bg-zinc-900" settings.mode === "light" ? "bg-zinc-200" : "bg-zinc-900"
}`} }`}
> >
<div className="px-3"> <div className="px-3 overflow-hidden text-ellipsis whitespace-nowrap">
{isHovered {props.tableData.name}
? props.tableData.name.length <= 10
? props.tableData.name
: `${props.tableData.name.substring(0, 10)}...`
: props.tableData.name.length <= 18
? props.tableData.name
: `${props.tableData.name.substring(0, 19)}...`}
</div> </div>
{isHovered && ( {isHovered && (
<div className="flex justify-end items-center mx-2"> <div className="flex justify-end items-center mx-2">