starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-25 10:51:26 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Better KeyValueRow sizing

Browse Source
This commit is contained in:
Gregory Schier
2024-10-02 11:22:20 -07:00
parent f8c3f71cfe
commit bb1ba93676
3 changed files with 19 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src-web/components/core/KeyValueRow.tsx
View File

@@ -11,7 +11,7 @@ export function KeyValueRows({ children }: Props) {
children = Array.isArray(children) ? children : [children];
return (
<table className="text-xs font-mono min-w-0 w-full mb-auto">
<tbody className="divide-highlightSecondary">
<tbody className="divide-y divide-surface-highlight">
{children.map((child, i) => (
<tr key={i}>{child}</tr>
))}
@@ -37,16 +37,18 @@ export function KeyValueRow({
<>
<td
className={classNames(
'py-0.5 pr-2 select-text cursor-text whitespace-nowrap',
'select-none py-0.5 pr-2 h-full align-top max-w-[10rem]',
labelClassName,
labelColor === 'primary' && 'text-primary',
labelColor === 'secondary' && 'text-text-subtle',
labelColor === 'info' && 'text-info',
)}
>
{label}
<span className="select-text cursor-text">{label}</span>
</td>
<td className="select-none py-0.5 break-all align-top max-w-[15rem]">
<div className="select-text cursor-text max-h-[5rem] overflow-y-auto">{value}</div>
</td>
<td className="py-0.5 cursor-text select-text break-all min-w-0">{value}</td>
</>
);
}