whai/cherry-studio
1
1
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

refactor: refactor upload component layout and styling for responsiveness #674

Browse Source 
fix: 当插入文件过多的时候，无法看到输入框了。 close #674
This commit is contained in:
kangfenmao 2025-01-08 10:21:17 +08:00
parent 1bdf6c7955
commit 3f4fa9b0ec
1 changed files with 20 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/renderer/src/pages/home/Inputbar/AttachmentPreview.tsx
View File

@ -17,16 +17,18 @@ const AttachmentPreview: FC<Props> = ({ files, setFiles }) => {
return ( return (
<Container> <Container>
<Upload <ContentContainer>
listType="picture-card" <Upload
fileList={files.map((file) => ({ listType={files.length > 20 ? 'text' : 'picture-card'}
uid: file.id, fileList={files.map((file) => ({
url: 'file://' + FileManager.getSafePath(file), uid: file.id,
status: 'done', url: 'file://' + FileManager.getSafePath(file),
name: file.name status: 'done',
}))} name: file.name
onRemove={(item) => setFiles(files.filter((file) => item.uid !== file.id))} }))}
/> onRemove={(item) => setFiles(files.filter((file) => item.uid !== file.id))}
/>
</ContentContainer>
</Container> </Container>
) )
} }
@ -35,9 +37,16 @@ const Container = styled.div`
display: flex; display: flex;
flex-direction: row; flex-direction: row;
gap: 10px; gap: 10px;
padding: 10px 20px; padding: 10px 0;
background: var(--color-background); background: var(--color-background);
border-top: 1px solid var(--color-border-mute); border-top: 1px solid var(--color-border-mute);
` `
const ContentContainer = styled.div`
max-height: 40vh;
width: 100%;
overflow-y: auto;
padding: 0 20px;
`
export default AttachmentPreview export default AttachmentPreview