Small layout changes to improve visibility on lower resolutions (1080p)

This commit is contained in:
grimsi
2025-06-14 15:34:47 +02:00
parent b1dd4cb8c1
commit ca7d458f3e
3 changed files with 64 additions and 70 deletions
@@ -181,7 +181,8 @@ export default function LibraryManagementGames({library}: LibraryManagementGames
<TableCell> <TableCell>
{item.metadata.path} {item.metadata.path}
</TableCell> </TableCell>
<TableCell className="flex flex-row gap-2"> <TableCell>
<div className="flex flex-row gap-2">
<Button isIconOnly size="sm" onPress={() => toggleMatchConfirmed(item)}> <Button isIconOnly size="sm" onPress={() => toggleMatchConfirmed(item)}>
{item.metadata.matchConfirmed ? {item.metadata.matchConfirmed ?
<Tooltip content="Unconfirm match"> <Tooltip content="Unconfirm match">
@@ -213,6 +214,7 @@ export default function LibraryManagementGames({library}: LibraryManagementGames
<Trash/> <Trash/>
</Tooltip> </Tooltip>
</Button> </Button>
</div>
</TableCell> </TableCell>
</TableRow> </TableRow>
)} )}
@@ -117,7 +117,8 @@ export default function LibraryManagementUnmatchedPaths({library}: LibraryManage
<TableCell> <TableCell>
{item.path} {item.path}
</TableCell> </TableCell>
<TableCell className="flex flex-row gap-2"> <TableCell>
<div className="flex flex-row gap-2">
<Tooltip content="Match game"> <Tooltip content="Match game">
<Button isIconOnly size="sm" onPress={() => { <Button isIconOnly size="sm" onPress={() => {
setSelectedPath(item.path); setSelectedPath(item.path);
@@ -131,6 +132,7 @@ export default function LibraryManagementUnmatchedPaths({library}: LibraryManage
onPress={() => deleteUnmatchedPath(item.path)}><Trash/> onPress={() => deleteUnmatchedPath(item.path)}><Trash/>
</Button> </Button>
</Tooltip> </Tooltip>
</div>
</TableCell> </TableCell>
</TableRow> </TableRow>
)} )}
@@ -69,32 +69,22 @@ export default function EditGameMetadataModal({game, isOpen, onOpenChange}: Edit
</div> </div>
<TextAreaInput key="summary" name="summary" label="Summary (HTML)"/> <TextAreaInput key="summary" name="summary" label="Summary (HTML)"/>
<TextAreaInput key="comment" name="comment" label="Comment (Markdown)"/> <TextAreaInput key="comment" name="comment" label="Comment (Markdown)"/>
<Accordion> <Accordion variant="splitted"
itemClasses={{
base: "-mx-2",
content: "max-h-80 overflow-y-auto",
}}>
<AccordionItem key="additional-metadata" <AccordionItem key="additional-metadata"
aria-label="Additional Metadata" aria-label="Additional Metadata"
title="Additional Metadata" title="Additional Metadata">
className="flex flex-col">
<div className="flex flex-row gap-4">
<ArrayInput key="developers" name="developers" label="Developers"/> <ArrayInput key="developers" name="developers" label="Developers"/>
<div className="w-0 border-s border-foreground/70"/>
<ArrayInput key="publishers" name="publishers" label="Publishers"/> <ArrayInput key="publishers" name="publishers" label="Publishers"/>
</div>
<div className="flex flex-row gap-4">
<ArrayInput key="genres" name="genres" label="Genres"/> <ArrayInput key="genres" name="genres" label="Genres"/>
<div className="w-0 border-s border-foreground/70"/>
<ArrayInput key="themes" name="themes" label="Themes"/> <ArrayInput key="themes" name="themes" label="Themes"/>
</div>
<div className="flex flex-row gap-4">
<ArrayInput key="keywords" name="keywords" label="Keywords"/> <ArrayInput key="keywords" name="keywords" label="Keywords"/>
<div className="w-0 border-s border-foreground/70"/>
<ArrayInput key="features" name="features" label="Features"/> <ArrayInput key="features" name="features" label="Features"/>
</div>
<div className="flex flex-row gap-4">
<ArrayInput key="perspectives" name="perspectives" <ArrayInput key="perspectives" name="perspectives"
label="Perspectives"/> label="Perspectives"/>
<div className="w-0 border-s border-foreground/70"/>
<div className="flex-1"/>
</div>
</AccordionItem> </AccordionItem>
</Accordion> </Accordion>
</ModalBody> </ModalBody>