Nicholai/jan
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore": update minor UI (#3281)

Browse Source 
* chore: update minor and missing ui

* chore: update ui import model

* 0.5.0-30

---------

Co-authored-by: Van Pham <64197333+Van-QA@users.noreply.github.com>
This commit is contained in:
Faisal Amir 2024-08-07 09:41:37 +07:00 committed by GitHub
parent 5a81865508
commit 105a9aa1a1
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
12 changed files with 45 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
electron/resources/version.txt
View File

@ -1 +1 @@
0.5.0-29
0.5.0-30

2
web/containers/Layout/BottomPanel/SystemMonitor/TableActiveModel/index.tsx
View File

@ -38,7 +38,7 @@ const TableActiveModel: React.FC = () => {
<div className="m-4 mr-0 w-1/2">
<div className="overflow-hidden rounded-lg border border-[hsla(var(--app-border))]">
<table className="w-full px-8">
<thead className="w-full border-b border-[hsla(var(--app-border))]">
<thead className="w-full border-b border-[hsla(var(--app-border))] first:border-none">
<tr>
{Column.map((col, i) => (
<th

4
web/screens/HubScreen2/components/BuiltInModelCard.tsx
View File

@ -57,7 +57,7 @@ const BuiltInModelCard: React.FC<HfModelEntry> = ({
</div>
<div className="pointer-events-auto flex flex-col items-end gap-2">
<DownloadContainer modelHandle={name} />
<span className="flex items-center gap-1 text-sm font-medium leading-3">
<span className="flex items-center gap-1 text-sm font-medium leading-3 text-[hsla(var(--text-secondary))]">
{addThousandSeparator(downloads)}
<CloudDownload size={14} />
</span>
@ -135,7 +135,7 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
Use
</Button>
) : downloadState != null ? (
<Button variant="soft">
<Button theme="ghost" className="p-0 text-[hsla(var(--primary-bg))]">
<div className="flex items-center space-x-2">
<span
className="inline-block"

18
web/screens/HubScreen2/components/HfListModel.tsx
View File

@ -60,7 +60,7 @@ const HfListModel: React.FC<Props> = ({ modelHandle }) => {
{downloadableModels.map((item) => (
<tr
key={item.rfilename}
className="border-b border-[hsla(var(--app-border))] last:border-b-0 hover:bg-[hsla(var(--primary-bg-soft))]"
className="group border-b border-[hsla(var(--app-border))] last:border-b-0 hover:bg-[hsla(var(--primary-bg-soft))]"
>
<td className="whitespace-nowrap py-4 pl-3">
<div className="w-fit rounded-md border border-[hsla(var(--app-border))] bg-transparent px-1.5 py-0.5 text-[var(--text-primary)]">
@ -70,7 +70,9 @@ const HfListModel: React.FC<Props> = ({ modelHandle }) => {
<td className="w-full pl-4">{item.rfilename}</td>
<td>
<div className="mr-3 flex items-center justify-end gap-3 whitespace-nowrap py-3">
<span>{toGibibytes(item.fileSize)}</span>
<span className="text-[hsla(var(--text-secondary))]">
{toGibibytes(item.fileSize)}
</span>
<DownloadContainer
modelHandle={modelHandle}
fileName={item.rfilename}
@ -149,7 +151,7 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
])
return (
<div className="flex items-center justify-center">
<div className="flex items-center justify-center transition-all">
{downloadedModel ? (
<Button
variant="soft"
@ -159,7 +161,7 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
Use
</Button>
) : downloadState != null ? (
<Button variant="soft">
<Button theme="ghost" className="p-0 text-[hsla(var(--primary-bg))]">
<div className="flex items-center space-x-2">
<span
className="inline-block"
@ -181,7 +183,13 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
</div>
</Button>
) : (
<Button onClick={onDownloadClick}>Download</Button>
<Button
onClick={onDownloadClick}
theme="ghost"
className="bg-[hsla(var(--secondary-bg))] group-hover:bg-[hsla(var(--primary-bg))] group-hover:text-[hsla(var(--primary-fg))]"
>
Download
</Button>
)}
</div>
)

2
web/screens/HubScreen2/components/HubModelCard.tsx
View File

@ -172,7 +172,7 @@ const HubModelCard: React.FC<HfModelEntry> = ({ name, downloads, model }) => {
>
{actionLabel}
</Button>
<span className="flex items-center gap-1 text-sm font-medium leading-3">
<span className="flex items-center gap-1 text-sm font-medium leading-3 text-[hsla(var(--text-secondary))]">
{addThousandSeparator(downloads)}
<CloudDownload size={14} />
</span>

2
web/screens/HubScreen2/components/HuggingFaceModelCard.tsx
View File

@ -146,7 +146,7 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
Use
</Button>
) : downloadState != null ? (
<Button variant="soft">
<Button theme="ghost" className="p-0 text-[hsla(var(--primary-bg))]">
<div className="flex items-center space-x-2">
<span
className="inline-block"

10
web/screens/HubScreen2/components/ListModel.tsx
View File

@ -212,7 +212,7 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
Use
</Button>
) : downloadState != null ? (
<Button variant="soft">
<Button theme="ghost" className="p-0 text-[hsla(var(--primary-bg))]">
<div className="flex items-center space-x-2">
<span className="inline-block" onClick={onAbortDownloadClick}>
Cancel
@ -231,7 +231,13 @@ const DownloadContainer: React.FC<DownloadContainerProps> = ({
</div>
</Button>
) : (
<Button onClick={onDownloadClick}>Download</Button>
<Button
onClick={onDownloadClick}
theme="ghost"
className="bg-[hsla(var(--secondary-bg))] group-hover:bg-[hsla(var(--primary-bg))] group-hover:text-[hsla(var(--primary-fg))]"
>
Download
</Button>
)}
</div>
)

6
web/screens/HubScreen2/components/SliderItem.tsx
View File

@ -53,11 +53,13 @@ const SliderItem: React.FC<Props> = ({ model }) => {
{shouldShowOwnerLogo && (
<Image width={20} height={20} src={model.logo} alt={model.author} />
)}
<span className="text-sm font-medium leading-4">{model.author}</span>
<span className="text-sm font-medium leading-4 text-[hsla(var(--text-secondary))]">
{model.author}
</span>
</div>
</div>
<div className="mt-4 flex items-center justify-between">
<span className="text-xs font-medium leading-3">
<span className="text-xs font-medium leading-3 text-[hsla(var(--text-secondary))]">
{toGibibytes(model.size)}
</span>
<DownloadContainer modelHandle={repoId} fileName={fileName} />

5
web/screens/Settings/Appearance/index.tsx
View File

@ -67,16 +67,21 @@ export default function AppearanceOptions() {
<div className="flex gap-x-2">
<h6 className="font-semibold capitalize">Interface theme</h6>
</div>
<p className="font-medium leading-relaxed text-[hsla(var(--text-secondary))]">
Translucent option is only available for some theme
</p>
</div>
<div className="flex items-center gap-x-2">
<Button
theme={reduceTransparent ? 'primary' : 'ghost'}
className="w-[120px]"
variant={reduceTransparent ? 'solid' : 'outline'}
onClick={() => setReduceTransparent(true)}
>
Solid
</Button>
<Button
className="w-[120px]"
theme={reduceTransparent ? 'ghost' : 'primary'}
variant={reduceTransparent ? 'outline' : 'solid'}
onClick={() => setReduceTransparent(false)}

2
web/screens/Settings/HuggingFaceRepoDetailModal/ModelDownloadRow/index.tsx
View File

@ -42,7 +42,7 @@ const ModelDownloadRow: React.FC<Props> = ({
quantization,
}) => {
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-row items-center justify-between space-x-1 rounded border border-[hsla(var(--app-border))] p-3">
<div className="flex">
{quantization && (
<Badge variant="soft" className="mr-1">

6
web/screens/Settings/HuggingFaceRepoDetailModal/ModelSegmentInfo/index.tsx
View File

@ -33,9 +33,9 @@ const ModelSegmentInfo = () => {
if (!importingHuggingFaceRepoData) return null
return (
<div className="flex w-full flex-col space-y-4">
<div className="flex flex-col space-y-4 lg:w-1/3">
<HeaderInfo title={'Model ID'}>
<h1 className="font-medium text-zinc-500 dark:text-gray-300">
<h1 className="mt-3 font-medium text-[hsla(var(--text-secondary))]">
{modelName}
</h1>
</HeaderInfo>
@ -63,7 +63,7 @@ const ModelSegmentInfo = () => {
<HeaderInfo title="Downloads">
<div className="flex flex-row items-center space-x-1.5">
<Download size={16} />
<span className="font-medium text-zinc-500 dark:text-gray-300">
<span className="font-medium text-[hsla(var(--text-secondary))]">
{downloads}
</span>
</div>

9
web/screens/Settings/HuggingFaceRepoDetailModal/index.tsx
View File

@ -39,11 +39,12 @@ const HuggingFaceRepoDetailModal = () => {
title={importingHuggingFaceRepoData.id}
fullPage
content={
<div className="flex h-full w-full flex-col">
<div className="flex">
<div className="flex h-full max-h-[600px] w-full flex-col overflow-x-hidden lg:max-h-[auto]">
<div className="flex h-full flex-col justify-between gap-4 lg:flex-row">
<ModelSegmentInfo />
<div className="mx-6 h-full border border-[hsla(var(--app-border))]" />
<ModelDownloadList />
<div className="w-full">
<ModelDownloadList />
</div>
</div>
</div>
}