tweak(ui): add colors to base/format badges

This commit is contained in:
psychedelicious 2024-03-07 17:44:27 +11:00
parent 2ca65ab9fa
commit ff66779aa3
2 changed files with 21 additions and 4 deletions

View File

@ -7,9 +7,17 @@ type Props = {
base: BaseModelType; base: BaseModelType;
}; };
const BASE_COLOR_MAP: Record<BaseModelType, string> = {
any: 'base',
'sd-1': 'green',
'sd-2': 'teal',
sdxl: 'invokeBlue',
'sdxl-refiner': 'invokeBlue',
};
const ModelBaseBadge = ({ base }: Props) => { const ModelBaseBadge = ({ base }: Props) => {
return ( return (
<Badge flexGrow={0} colorScheme="invokeBlue" variant="subtle"> <Badge flexGrow={0} colorScheme={BASE_COLOR_MAP[base]} variant="subtle">
{MODEL_TYPE_SHORT_MAP[base]} {MODEL_TYPE_SHORT_MAP[base]}
</Badge> </Badge>
); );

View File

@ -6,7 +6,7 @@ type Props = {
format: AnyModelConfig['format']; format: AnyModelConfig['format'];
}; };
const MODEL_FORMAT_NAME_MAP = { const FORMAT_NAME_MAP: Record<AnyModelConfig['format'], string> = {
diffusers: 'diffusers', diffusers: 'diffusers',
lycoris: 'lycoris', lycoris: 'lycoris',
checkpoint: 'checkpoint', checkpoint: 'checkpoint',
@ -15,10 +15,19 @@ const MODEL_FORMAT_NAME_MAP = {
embedding_folder: 'embedding', embedding_folder: 'embedding',
}; };
const FORMAT_COLOR_MAP: Record<AnyModelConfig['format'], string> = {
diffusers: 'base',
lycoris: 'base',
checkpoint: 'orange',
invokeai: 'base',
embedding_file: 'base',
embedding_folder: 'base',
};
const ModelFormatBadge = ({ format }: Props) => { const ModelFormatBadge = ({ format }: Props) => {
return ( return (
<Badge flexGrow={0} colorScheme="base" variant="subtle"> <Badge flexGrow={0} colorScheme={FORMAT_COLOR_MAP[format]} variant="subtle">
{MODEL_FORMAT_NAME_MAP[format]} {FORMAT_NAME_MAP[format]}
</Badge> </Badge>
); );
}; };