Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2025-12-27 12:51:26 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

style: 优化消息滚动条 (#7549)

Browse Source 
* feat(Messages): integrate Scrollbar component into Message and MessageGroup styled containers

* style(Messages): add margin-top to MessageFooter for improved layout

* fix(SelectionToolbar): update regex to remove background styles more accurately
This commit is contained in:
Teo 2025-06-26 11:42:12 +08:00 committed by GitHub
parent 5e0cae06db
commit 08a526e511
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 6 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/renderer/src/pages/home/Messages/Message.tsx
View File

@ -1,3 +1,4 @@
import Scrollbar from '@renderer/components/Scrollbar'
import { useMessageEditing } from '@renderer/context/MessageEditingContext'
import { useAssistant } from '@renderer/hooks/useAssistant'
import { useMessageOperations } from '@renderer/hooks/useMessageOperations'
@ -215,7 +216,7 @@ const MessageContainer = styled.div`
}
`
const MessageContentContainer = styled.div`
const MessageContentContainer = styled(Scrollbar)`
max-width: 100%;
padding-left: 46px;
margin-top: 5px;
@ -229,6 +230,7 @@ const MessageFooter = styled.div`
align-items: center;
gap: 20px;
margin-left: 46px;
margin-top: 2px;
`
const NewContextMessage = styled.div`

3
src/renderer/src/pages/home/Messages/MessageGroup.tsx
View File

@ -1,3 +1,4 @@
import Scrollbar from '@renderer/components/Scrollbar'
import { MessageEditingProvider } from '@renderer/context/MessageEditingContext'
import { useChatContext } from '@renderer/hooks/useChatContext'
import { useMessageOperations } from '@renderer/hooks/useMessageOperations'
@ -257,7 +258,7 @@ const GroupContainer = styled.div`
}
`
const GridContainer = styled.div<{ $count: number; $gridColumns: number }>`
const GridContainer = styled(Scrollbar)<{ $count: number; $gridColumns: number }>`
width: 100%;
display: grid;
overflow-y: visible;

2
src/renderer/src/windows/selection/toolbar/SelectionToolbar.tsx
View File

@ -159,7 +159,7 @@ const SelectionToolbar: FC<{ demo?: boolean }> = ({ demo = false }) => {
}
if (customCss) {
const newCustomCss = customCss.replace(/background(-image|-color)?\s*:[^;]+;/gi, '')
const newCustomCss = customCss.replace(/(^|\s)background(-image|-color)?\s*:[^;]+;/gi, '')
customCssElement = document.createElement('style')
customCssElement.id = 'user-defined-custom-css'