fix: responsive modal import model (#3449)

This commit is contained in:
Faisal Amir 2024-08-26 11:54:31 +07:00 committed by GitHub
parent 925cd04d20
commit 6d33ff60f9
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 6 additions and 5 deletions

View File

@ -29,7 +29,7 @@ const ModelDownloadList = () => {
return (
<div className="flex h-[500px] flex-1 flex-col">
<h1 className="mb-3 font-semibold">Available Versions</h1>
<ScrollArea className="w-full flex-1">
<ScrollArea className="w-full md:flex-1">
{ggufModels.map((model, index) => {
if (!model.downloadUrl) return null
return (

View File

@ -114,7 +114,7 @@ const ModelDownloadRow: React.FC<Props> = ({
}
return (
<div className="flex w-[662px] flex-row items-center justify-between space-x-1 rounded border border-[hsla(var(--app-border))] p-3">
<div className="flex flex-col gap-4 space-x-1 rounded border border-[hsla(var(--app-border))] p-3 md:flex-row md:items-center md:justify-between lg:w-[550px]">
<div className="flex">
{quantization && (
<Badge variant="soft" className="mr-1">
@ -124,7 +124,9 @@ const ModelDownloadRow: React.FC<Props> = ({
<h1 className="mr-5 line-clamp-1 font-medium text-[hsla(var(--text-secondary))]">
{fileName}
</h1>
<Badge theme="secondary">{toGibibytes(fileSize)}</Badge>
<Badge theme="secondary" className="hidden md:flex">
{toGibibytes(fileSize)}
</Badge>
</div>
{isDownloaded ? (

View File

@ -40,9 +40,8 @@ const HuggingFaceRepoDetailModal = () => {
fullPage
content={
<div className="flex h-full w-full flex-col">
<div className="flex">
<div className="flex flex-col gap-4 lg:flex-row">
<ModelSegmentInfo />
<div className="mx-6 h-full border border-[hsla(var(--app-border))]" />
<ModelDownloadList />
</div>
</div>