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

fix: reduce hub header panel contrast color button and badge

Browse Source
This commit is contained in:
Faisal Amir 2024-01-11 11:36:17 +07:00
parent 4a70b8a125
commit c64d0038f3
4 changed files with 10 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
uikit/src/badge/index.tsx
View File

@ -6,6 +6,7 @@ const badgeVariants = cva('badge', {
variants: { variants: {
themes: { themes: {
primary: 'badge-primary', primary: 'badge-primary',
warning: 'badge-warning',
success: 'badge-success', success: 'badge-success',
secondary: 'badge-secondary', secondary: 'badge-secondary',
danger: 'badge-danger', danger: 'badge-danger',

4
uikit/src/badge/styles.scss
View File

@ -21,6 +21,10 @@
@apply border-transparent bg-red-100 text-red-700; @apply border-transparent bg-red-100 text-red-700;
} }
&-warning {
@apply border-transparent bg-yellow-100 text-yellow-700;
}
&-outline { &-outline {
@apply text-foreground border-border border; @apply text-foreground border-border border;
} }

2
uikit/src/button/styles.scss
View File

@ -8,7 +8,7 @@
} }
&-secondary-blue { &-secondary-blue {
@apply bg-blue-200 text-blue-900 hover:bg-blue-500/80; @apply bg-blue-200 text-blue-600 hover:bg-blue-500/80;
} }
&-danger { &-danger {

8
web/screens/ExploreModels/ExploreModelItemHeader/index.tsx
View File

@ -71,7 +71,7 @@ const ExploreModelItemHeader: React.FC<Props> = ({ model, onClick, open }) => {
if (isDownloaded) { if (isDownloaded) {
downloadButton = ( downloadButton = (
<Button <Button
themes="success" themes="secondaryBlue"
className="min-w-[98px]" className="min-w-[98px]"
onClick={onUseModelClick} onClick={onUseModelClick}
> >
@ -92,21 +92,21 @@ const ExploreModelItemHeader: React.FC<Props> = ({ model, onClick, open }) => {
if (minimumRamModel > totalRam) { if (minimumRamModel > totalRam) {
return ( return (
<Badge className="rounded-md bg-red-500 text-white"> <Badge className="rounded-md" themes="danger">
Not enough RAM Not enough RAM
</Badge> </Badge>
) )
} }
if (minimumRamModel < availableRam) { if (minimumRamModel < availableRam) {
return ( return (
<Badge className="rounded-md bg-green-500 text-white"> <Badge className="rounded-md" themes="success">
Recommended Recommended
</Badge> </Badge>
) )
} }
if (minimumRamModel < totalRam && minimumRamModel > availableRam) { if (minimumRamModel < totalRam && minimumRamModel > availableRam) {
return ( return (
<Badge className="rounded-md bg-yellow-500 text-white"> <Badge className="rounded-md" themes="warning">
Slow on your device Slow on your device
</Badge> </Badge>
) )