ishangsf/DeepCodeGeniusWeb-vscode
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor InputMessage component

Browse Source 
- Adjust the styling of the rightSection in the InputMessage component
- Remove duplicate Indicator and ActionIcon for the context menus
- Add marginLeft to the send button for proper spacing
This commit is contained in:
Rankin Zheng 2023-09-13 20:47:22 +08:00 committed by bobo.yang
parent b5a0cb60f9
commit 778ba44124
1 changed files with 24 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

47
src/views/components/InputMessage/index.tsx
View File

@ -385,7 +385,7 @@ const InputMessage = observer((props: any) => {
}}
placeholder="Ask DevChat a question or type ‘/’ for workflow"
styles={{
rightSection: { alignItems: 'flex-end', marginBottom:'5px', marginRight: (contexts.length > 0 ? '30px' : '5px') },
rightSection: { alignItems: 'flex-end', marginBottom:'6px', marginRight: (contexts.length > 0 ? '24px' : '10px') },
input: {
fontSize: 'var(--vscode-editor-font-size)',
backgroundColor: 'var(--vscode-input-background)',
@ -398,6 +398,28 @@ const InputMessage = observer((props: any) => {
}}
rightSection={
<>
{contexts.length > 0 &&
<Indicator label={contexts.length} size={12}>
<ActionIcon
size='md'
radius="md"
variant="default"
disabled={generating}
onClick={openDrawer}
sx={{
pointerEvents: 'all',
'&:hover': {
backgroundColor: 'var(--vscode-toolbar-activeBackground)'
},
'&[data-disabled]': {
borderColor: 'var(--vscode-input-border)',
backgroundColor: 'var(--vscode-toolbar-activeBackground)'
}
}}>
<IconPaperclip size="1rem" />
</ActionIcon>
</Indicator>
}
<ActionIcon
size='md'
radius="md"
@ -405,6 +427,7 @@ const InputMessage = observer((props: any) => {
disabled={generating}
onClick={handleSendClick}
sx={{
marginLeft: '10px',
pointerEvents: 'all',
backgroundColor:'#ED6A45',
border:'0',
@ -421,28 +444,6 @@ const InputMessage = observer((props: any) => {
}}>
<IconSend size="1rem" />
</ActionIcon>
{contexts.length > 0 &&
<Indicator label={contexts.length} size={12}>
<ActionIcon
size='md'
radius="md"
variant="default"
disabled={generating}
onClick={openDrawer}
sx={{
marginLeft: '3px',
pointerEvents: 'all',
'&:hover': {
backgroundColor: 'var(--vscode-toolbar-activeBackground)'
},
'&[data-disabled]': {
borderColor: 'var(--vscode-input-border)',
backgroundColor: 'var(--vscode-toolbar-activeBackground)'
}
}}>
<IconPaperclip size="1rem" />
</ActionIcon>
</Indicator>}
</>
}
/>