administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-02-02 01:05:20 +03:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

center buttons small devices

Browse Source
This commit is contained in:
Bernt Christian Egeland 2021-08-20 07:58:37 +02:00
parent b98a5b4db8
commit 2c65dbda27
1 changed files with 13 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
web/src/routes/Event.jsx
View File

@ -55,17 +55,19 @@ export default function Event({ eventId }) {
return ( return (
<div className="space-y-4"> <div className="space-y-4">
<div className="flex flex-wrap space-x-4"> <div className="flex flex-wrap justify-center">
<Heading className="flex-grow"> <Heading className="flex-grow">
{data.camera} {data.label} <span className="text-sm">{startime.toLocaleString()}</span> {data.camera} {data.label} <span className="text-sm">{startime.toLocaleString()}</span>
</Heading> </Heading>
<Button className="self-start" onClick={() => setShowDetails(!showDetails)} color="gray"> <div className="space-x-4">
<ArrowDown className="w-6" /> <Button className="self-start" onClick={() => setShowDetails(!showDetails)} color="gray">
{`${showDetails ? 'Hide event Details' : 'View event Details'}`} <ArrowDown className="w-6" />
</Button> {`${showDetails ? 'Hide event Details' : 'View event Details'}`}
<Button className="self-start" color="red" onClick={handleClickDelete}> </Button>
<Delete className="w-6" /> Delete event <Button className="self-start" color="red" onClick={handleClickDelete}>
</Button> <Delete className="w-6" /> Delete event
</Button>
</div>
{showDialog ? ( {showDialog ? (
<Dialog <Dialog
onDismiss={handleDismissDeleteDialog} onDismiss={handleDismissDeleteDialog}
@ -136,21 +138,11 @@ export default function Event({ eventId }) {
onReady={(player) => {}} onReady={(player) => {}}
/> />
</div> </div>
<div className="text-center"> <div className="flex space-x-4 justify-center">
<Button <Button color="blue" href={`${apiHost}/api/events/${eventId}/clip.mp4?download=true`} download>
className="mx-2"
color="blue"
href={`${apiHost}/api/events/${eventId}/clip.mp4?download=true`}
download
>
<Clip className="w-6" /> Download Clip <Clip className="w-6" /> Download Clip
</Button> </Button>
<Button <Button color="blue" href={`${apiHost}/api/events/${eventId}/snapshot.jpg?download=true`} download>
className="mx-2"
color="blue"
href={`${apiHost}/api/events/${eventId}/snapshot.jpg?download=true`}
download
>
<Snapshot className="w-6" /> Download Snapshot <Snapshot className="w-6" /> Download Snapshot
</Button> </Button>
</div> </div>