Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): fix model name overflow

Browse Source 
Closes #3897
This commit is contained in:
psychedelicious 2024-04-03 15:15:56 +11:00
parent c4a6d3ddc0
commit 9fdfd4267c
3 changed files with 11 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelManagerPanel/ModelListItem.tsx
View File

@ -90,11 +90,13 @@ const ModelListItem = (props: ModelListItemProps) => {
cursor="pointer" cursor="pointer"
onClick={handleSelectModel} onClick={handleSelectModel}
> >
<Flex gap={2} w="full" h="full"> <Flex gap={2} w="full" h="full" minW={0}>
<ModelImage image_url={model.cover_image} /> <ModelImage image_url={model.cover_image} />
<Flex gap={1} alignItems="flex-start" flexDir="column" w="full"> <Flex gap={1} alignItems="flex-start" flexDir="column" w="full" minW={0}>
<Flex gap={2} w="full" alignItems="flex-start"> <Flex gap={2} w="full" alignItems="flex-start">
<Text fontWeight="semibold">{model.name}</Text> <Text fontWeight="semibold" noOfLines={1} wordBreak="break-all">
{model.name}
</Text>
<Spacer /> <Spacer />
</Flex> </Flex>
<Text variant="subtext" noOfLines={1}> <Text variant="subtext" noOfLines={1}>

6
invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/Model.tsx
View File

@ -87,9 +87,9 @@ export const Model = () => {
<Flex flexDir="column" gap={4}> <Flex flexDir="column" gap={4}>
<Flex alignItems="flex-start" gap={4}> <Flex alignItems="flex-start" gap={4}>
<ModelImageUpload model_key={selectedModelKey} model_image={data.cover_image} /> <ModelImageUpload model_key={selectedModelKey} model_image={data.cover_image} />
<Flex flexDir="column" gap={1} flexGrow={1}> <Flex flexDir="column" gap={1} flexGrow={1} minW={0}>
<Flex gap={2}> <Flex gap={2}>
<Heading as="h2" fontSize="lg"> <Heading as="h2" fontSize="lg" noOfLines={1} wordBreak="break-all">
{data.name} {data.name}
</Heading> </Heading>
<Spacer /> <Spacer />
@ -114,7 +114,7 @@ export const Model = () => {
)} )}
</Flex> </Flex>
{data.source && ( {data.source && (
<Text variant="subtext"> <Text variant="subtext" noOfLines={1} wordBreak="break-all">
{t('modelManager.source')}: {data?.source} {t('modelManager.source')}: {data?.source}
</Text> </Text>
)} )}

4
invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/ModelAttrView.tsx
View File

@ -9,7 +9,9 @@ export const ModelAttrView = ({ label, value }: Props) => {
return ( return (
<FormControl flexDir="column" alignItems="flex-start" gap={0}> <FormControl flexDir="column" alignItems="flex-start" gap={0}>
<FormLabel>{label}</FormLabel> <FormLabel>{label}</FormLabel>
<Text fontSize="md">{value || '-'}</Text> <Text fontSize="md" noOfLines={1} wordBreak="break-all">
{value || '-'}
</Text>
</FormControl> </FormControl>
); );
}; };