skrazzo-public/cover-letter-templater
Archived
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

style(container): make container smaller, easier to read

Browse Source
This commit is contained in:
Leons Aleksandrovs
2025-07-14 15:42:13 +03:00
parent f9841868b3
commit a6311bb74a
1 changed files with 34 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

64
frontend/src/routes/cover/$coverId.tsx
View File

@@ -61,40 +61,44 @@ function RouteComponent() {
return ( return (
<Authorised> <Authorised>
<div className="flex items-center gap-4 mb-8 md:justify-between"> <div className="max-w-4xl mx-auto">
<h1 className="text-2xl font-semibold">{cover.data?.cover.name || "Loading..."}</h1> <div className="flex max-md:flex-col items-center gap-4 mb-8 md:justify-between">
<h1 className="text-2xl max-md:text-center font-semibold">
{cover.data?.cover.name || "Loading..."}
</h1>
<div className="space-x-2"> <div className="space-x-2">
<Button <Button
className="hover:bg-danger hover:text-background" className="hover:bg-danger hover:text-background"
variant="ghost" variant="ghost"
onClick={handleDelete} onClick={handleDelete}
> >
<Trash2 /> <Trash2 />
</Button>
<Link
to={"/cover/edit/$coverId"}
params={{ coverId: cover.data?.cover.id.toString() || "" }}
>
<Button variant="outline">
<EditIcon />
</Button> </Button>
</Link> <Link
<Button onClick={handleDownload}> to={"/cover/edit/$coverId"}
<DownloadIcon /> params={{ coverId: cover.data?.cover.id.toString() || "" }}
</Button> >
<Button variant="outline">
<EditIcon />
</Button>
</Link>
<Button onClick={handleDownload}>
<DownloadIcon />
</Button>
</div>
</div> </div>
</div>
<div ref={coverRef} className="bg-background p-4 border"> <div ref={coverRef} className="bg-background p-4 border">
{coverState !== null ? ( {coverState !== null ? (
coverState coverState
) : ( ) : (
<div <div
className="tiptap" className="tiptap"
dangerouslySetInnerHTML={{ __html: cover.data?.cover.letter || "" }} dangerouslySetInnerHTML={{ __html: cover.data?.cover.letter || "" }}
/> />
)} )}
</div>
</div> </div>
</Authorised> </Authorised>
); );