fix not able to scroll in my models screen

Signed-off-by: James <james@jan.ai>
This commit is contained in:
James 2023-10-04 19:49:03 -07:00 committed by Louis
parent 223a95ef3d
commit 7171bde1d9
5 changed files with 22 additions and 15 deletions

View File

@ -9,10 +9,10 @@ const ActiveModelTable: React.FC = () => {
if (!activeModel) return null; if (!activeModel) return null;
return ( return (
<Fragment> <div className="pl-[63px] pr-[89px]">
<h3 className="text-xl leading-[25px] mb-[13px]">Active Model(s)</h3> <h3 className="text-xl leading-[25px] mb-[13px]">Active Model(s)</h3>
<ModelTable models={[activeModel]} /> <ModelTable models={[activeModel]} />
</Fragment> </div>
); );
}; };

View File

@ -7,13 +7,13 @@ const DownloadedModelTable: React.FC = () => {
const { downloadedModels } = useGetDownloadedModels(); const { downloadedModels } = useGetDownloadedModels();
return ( return (
<Fragment> <div className="pl-[63px] pr-[89px]">
<h3 className="text-xl leading-[25px] mt-[50px]">Downloaded Models</h3> <h3 className="text-xl leading-[25px] mt-[50px]">Downloaded Models</h3>
<div className="py-5 w-[568px]"> <div className="py-5 w-[568px]">
<SearchBar /> <SearchBar />
</div> </div>
<ModelTable models={downloadedModels} /> <ModelTable models={downloadedModels} />
</Fragment> </div>
); );
}; };

View File

@ -17,10 +17,12 @@ const DownloadingModelTable: React.FC = () => {
} }
return ( return (
<Fragment> <div className="pl-[63px] pr-[89px]">
<h3 className="text-xl leading-[25px] mt-[50px] mb-4">Downloading Models</h3> <h3 className="text-xl leading-[25px] mt-[50px] mb-4">
Downloading Models
</h3>
<ModelDownloadingTable downloadStates={downloadStates} /> <ModelDownloadingTable downloadStates={downloadStates} />
</Fragment> </div>
); );
}; };

View File

@ -1,11 +1,14 @@
import React from 'react'; import React from "react";
type Props = { type Props = {
title: string; title: string;
className?: string;
}; };
const HeaderTitle: React.FC<Props> = ({ title }) => ( const HeaderTitle: React.FC<Props> = ({ title, className }) => (
<h2 className="my-5 font-semibold text-[34px] tracking-[-0.4px] leading-[41px]"> <h2
className={`my-5 font-semibold text-[34px] tracking-[-0.4px] leading-[41px] ${className}`}
>
{title} {title}
</h2> </h2>
); );

View File

@ -4,11 +4,13 @@ import ActiveModelTable from "../ActiveModelTable";
import DownloadingModelTable from "../DownloadingModelTable"; import DownloadingModelTable from "../DownloadingModelTable";
const MyModelContainer: React.FC = () => ( const MyModelContainer: React.FC = () => (
<div className="flex flex-col w-full h-full pl-[63px] pr-[89px] pt-[60px]"> <div className="flex flex-col w-full h-full pt-[60px]">
<HeaderTitle title="My Models" /> <HeaderTitle title="My Models" className="pl-[63px] pr-[89px]" />
<ActiveModelTable /> <div className="pb-6 overflow-y-auto scroll">
<DownloadingModelTable /> <ActiveModelTable />
<DownloadedModelTable /> <DownloadingModelTable />
<DownloadedModelTable />
</div>
</div> </div>
); );