feat: Add spacing and height to chat panel controls

Add spacing of 5 between the chat panel controls and set the height of the controls to 30. Also, reduce the size of the action icon from lg to sm. Finally, change the shadow of the command menu from xs to sm.
This commit is contained in:
Rankin Zheng 2023-05-18 19:58:29 +08:00
parent d692a24bc5
commit 4fd3a80cb6

View File

@ -428,6 +428,7 @@ const chatPanel = () => {
{contexts &&
<Accordion variant="contained" chevronPosition="left"
sx={{
marginTop: 5,
backgroundColor: 'var(--vscode-menu-background)',
}}
styles={{
@ -436,6 +437,7 @@ const chatPanel = () => {
backgroundColor: 'var(--vscode-menu-background)',
},
control: {
height: 30,
backgroundColor: 'var(--vscode-menu-background)',
'&:hover': {
backgroundColor: 'var(--vscode-menu-background)',
@ -623,6 +625,7 @@ const chatPanel = () => {
{messageList.length > 0 ? messageList : defaultMessages}
</ScrollArea>
<Stack
spacing={5}
sx={{ position: 'absolute', bottom: 10, width: scrollViewport.current?.clientWidth }}>
{generating &&
<Center>
@ -661,6 +664,7 @@ const chatPanel = () => {
backgroundColor: 'var(--vscode-menu-background)',
},
control: {
height: 30,
backgroundColor: 'var(--vscode-menu-background)',
'&:hover': {
backgroundColor: 'var(--vscode-menu-background)',
@ -697,7 +701,7 @@ const chatPanel = () => {
</Accordion.Control>
<ActionIcon
mr={8}
size="lg"
size="sm"
sx={{
color: 'var(--vscode-menu-foreground)',
'&:hover': {
@ -731,7 +735,7 @@ const chatPanel = () => {
id='commandMenu'
position='top-start'
closeOnClickOutside={true}
shadow="xs"
shadow="sm"
width={scrollViewport.current?.clientWidth}
opened={menuOpend}
onChange={() => {