administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-08-05 18:38:54 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix frigate+ pane layout and buttons to match other settings panes

Browse Source
This commit is contained in:
Josh Hawkins
2026-05-11 15:25:38 -05:00
parent a4c6e11642
commit b07ebb4b58
1 changed files with 321 additions and 321 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web/src/views/settings/FrigatePlusSettingsView.tsx
+32 -32
View File
@@ -239,11 +239,9 @@ export default function FrigatePlusSettingsView({
}
return (
<div className="flex size-full flex-col md:flex-row">
<div className="flex size-full flex-col md:pr-2">
<Toaster position="top-center" closeButton={true} />
<div className="mt-2 flex h-full w-full flex-col">
<div className="scrollbar-container flex-1 overflow-y-auto">
<div className="w-full max-w-5xl space-y-6">
<div className="w-full max-w-5xl space-y-6 pt-2">
<div className="flex flex-col gap-0">
<Heading as="h4" className="mb-2">
{t("frigatePlus.title")}
@@ -298,9 +296,7 @@ export default function FrigatePlusSettingsView({
)}
{config?.plus?.enabled && (
<SettingsGroupCard
title={t("frigatePlus.cardTitles.otherModels")}
>
<SettingsGroupCard title={t("frigatePlus.cardTitles.otherModels")}>
<SplitCardRow
label={t("frigatePlus.modelInfo.availableModels")}
description={
@@ -339,8 +335,7 @@ export default function FrigatePlusSettingsView({
"frigatePlus.modelInfo.plusModelType.userModel",
)) +
") " +
availableModels[frigatePlusSettings.model.id]
.name +
availableModels[frigatePlusSettings.model.id].name +
" (" +
availableModels[frigatePlusSettings.model.id]
.width +
@@ -349,9 +344,7 @@ export default function FrigatePlusSettingsView({
.height +
")"
: isLoadingModels
? t(
"frigatePlus.modelInfo.loadingAvailableModels",
)
? t("frigatePlus.modelInfo.loadingAvailableModels")
: t("frigatePlus.modelInfo.selectModel")}
</SelectTrigger>
@@ -465,9 +458,7 @@ export default function FrigatePlusSettingsView({
</SettingsGroupCard>
)}
<SettingsGroupCard
title={t("frigatePlus.cardTitles.configuration")}
>
<SettingsGroupCard title={t("frigatePlus.cardTitles.configuration")}>
<SplitCardRow
label={t("frigatePlus.snapshotConfig.title")}
description={
@@ -500,9 +491,7 @@ export default function FrigatePlusSettingsView({
{t("frigatePlus.snapshotConfig.table.camera")}
</th>
<th className="px-4 py-2 text-center">
{t(
"frigatePlus.snapshotConfig.table.snapshots",
)}
{t("frigatePlus.snapshotConfig.table.snapshots")}
</th>
</tr>
</thead>
@@ -535,25 +524,37 @@ export default function FrigatePlusSettingsView({
</SettingsGroupCard>
</div>
</div>
</div>
<div className="sticky bottom-0 z-50 w-full border-t border-secondary bg-background pb-5 pt-0 md:pr-2">
<div className="flex flex-col items-center gap-4 pt-2 md:flex-row md:justify-end">
<div className="flex w-full items-center gap-2 md:w-auto">
<Button
className="flex min-w-36 flex-1 gap-2"
variant="outline"
aria-label={t("button.reset", { ns: "common" })}
onClick={onCancel}
<div className="sticky bottom-0 z-50 mt-6 w-full border-t border-secondary bg-background pt-0">
<div
className={cn(
"flex flex-col items-center gap-4 pt-2 md:flex-row",
changedValue ? "justify-between" : "justify-end",
)}
>
{t("button.reset", { ns: "common" })}
</Button>
{changedValue && (
<div className="flex items-center gap-2">
<span className="text-sm text-unsaved">
{t("unsavedChanges")}
</span>
</div>
)}
<div className="flex w-full flex-col gap-2 sm:flex-row sm:items-center md:w-auto">
{changedValue && (
<Button
onClick={onCancel}
variant="outline"
disabled={isLoading}
className="flex min-w-36 flex-1 gap-2"
>
{t("button.undo", { ns: "common" })}
</Button>
)}
<Button
onClick={saveToConfig}
variant="select"
disabled={!changedValue || isLoading}
className="flex min-w-36 flex-1 gap-2"
aria-label={t("button.save", { ns: "common" })}
onClick={saveToConfig}
>
{isLoading ? (
<>
@@ -567,7 +568,6 @@ export default function FrigatePlusSettingsView({
</div>
</div>
</div>
</div>
<RestartDialog
isOpen={restartDialogOpen}
onClose={() => setRestartDialogOpen(false)}