administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2025-12-16 18:16:44 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

Clean up mobile

Browse Source
This commit is contained in:
Nicolas Mowen 2025-10-21 15:55:37 -06:00
parent d9216d39e6
commit 6d662151de
2 changed files with 24 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
web/src/components/card/ClassificationCard.tsx
View File

@ -272,7 +272,15 @@ export function GroupedClassificationCard({
}} }}
> >
<Trigger asChild></Trigger> <Trigger asChild></Trigger>
<Content className={cn("", isDesktop && "w-auto max-w-[85%]")}> <Content
className={cn(
"",
isDesktop && "w-auto max-w-[85%]",
!isDesktop &&
"max-h-[75dvh] overflow-hidden rounded-t-2xl px-4 pb-4",
)}
onOpenAutoFocus={(e) => e.preventDefault()}
>
<> <>
{isDesktop && ( {isDesktop && (
<div className="absolute right-10 top-4 flex flex-row justify-between"> <div className="absolute right-10 top-4 flex flex-row justify-between">
@ -300,7 +308,12 @@ export function GroupedClassificationCard({
)} )}
</div> </div>
)} )}
<ContentTitle className="flex items-center gap-1 font-normal capitalize"> <ContentTitle
className={cn(
"flex items-center gap-1 font-normal capitalize",
isMobile && "px-2",
)}
>
{event?.sub_label ? event.sub_label : t("details.unknown")} {event?.sub_label ? event.sub_label : t("details.unknown")}
{event?.sub_label && ( {event?.sub_label && (
<div <div
@ -313,7 +326,7 @@ export function GroupedClassificationCard({
>{`${Math.round((event.data.sub_label_score || 0) * 100)}%`}</div> >{`${Math.round((event.data.sub_label_score || 0) * 100)}%`}</div>
)} )}
</ContentTitle> </ContentTitle>
<ContentDescription> <ContentDescription className={cn("", isMobile && "px-2")}>
{time && ( {time && (
<TimeAgo <TimeAgo
className="text-sm text-secondary-foreground" className="text-sm text-secondary-foreground"
@ -324,8 +337,9 @@ export function GroupedClassificationCard({
</ContentDescription> </ContentDescription>
<div <div
className={cn( className={cn(
"flex cursor-pointer flex-col gap-2 rounded-lg p-2", "flex cursor-pointer flex-col gap-2 rounded-lg",
isMobile && "w-full", isDesktop && "p-2",
isMobile && "scrollbar-container w-full overflow-y-auto",
)} )}
> >
<div <div

7
web/src/pages/FaceLibrary.tsx
View File

@ -51,7 +51,7 @@ import {
useRef, useRef,
useState, useState,
} from "react"; } from "react";
import { isDesktop } from "react-device-detect"; import { isDesktop, isMobileOnly } from "react-device-detect";
import { Trans, useTranslation } from "react-i18next"; import { Trans, useTranslation } from "react-i18next";
import { import {
LuFolderCheck, LuFolderCheck,
@ -694,7 +694,10 @@ function TrainingGrid({
return ( return (
<div <div
ref={contentRef} ref={contentRef}
className="scrollbar-container flex flex-wrap gap-2 overflow-y-scroll p-1" className={cn(
"scrollbar-container gap-2 overflow-y-scroll p-1",
isMobileOnly ? "grid grid-cols-2" : "flex flex-wrap",
)}
> >
{Object.entries(faceGroups).map(([key, group]) => { {Object.entries(faceGroups).map(([key, group]) => {
const event = events?.find((ev) => ev.id == key); const event = events?.find((ev) => ev.id == key);