feat: Align the cards on the Model Providers page #2111 (#2125)

### What problem does this PR solve?

feat: Align the cards on the Model Providers page #2111

### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu 2024-08-27 19:27:58 +08:00 committed by GitHub
parent c8097e97cb
commit a2b4d0190c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 18 additions and 5 deletions

View File

@ -17,6 +17,9 @@
border: 1px solid #eaecf0;
background: #e3f0ff;
box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
:global(.ant-card-body) {
padding: 10px 24px;
}
}
.addedCard {
border-radius: 18px;
@ -24,4 +27,12 @@
background: #e6e7eb;
box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);
}
.modelDivider {
margin: 0;
}
.modelTags {
height: 40px;
overflow: hidden;
font-size: 8px;
}
}

View File

@ -286,20 +286,22 @@ const UserSettingModel = () => {
md: 3,
lg: 4,
xl: 4,
xxl: 8,
xxl: 10,
}}
dataSource={factoryList}
renderItem={(item) => (
<List.Item>
<Card className={styles.toBeAddedCard}>
<Flex vertical gap={'large'}>
<Flex vertical gap={'middle'}>
<LlmIcon name={item.name} />
<Flex vertical gap={'middle'}>
<b>{item.name}</b>
<Text>{item.tags}</Text>
<b>
<Text ellipsis={{ tooltip: item.name }}>{item.name}</Text>
</b>
<Text className={styles.modelTags}>{item.tags}</Text>
</Flex>
</Flex>
<Divider></Divider>
<Divider className={styles.modelDivider}></Divider>
<Button type="link" onClick={() => handleAddModel(item.name)}>
{t('addTheModel')}
</Button>