Northern_Lights/cherry-studio
1
0
Fork 0
mirror of https://github.com/CherryHQ/cherry-studio.git synced 2026-01-07 13:59:28 +08:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

refactor(Settings): update input components to use Space.Compact for better layout and consistency across various settings pages

Browse Source
This commit is contained in:
Teo 2025-06-11 14:19:56 +08:00 committed by kangfenmao
parent 76387643f7
commit 88e251cee7
6 changed files with 50 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/renderer/src/context/AntdProvider.tsx
View File

@ -38,7 +38,15 @@ const AntdProvider: FC<PropsWithChildren> = ({ children }) => {
boxShadowSecondary: 'none', boxShadowSecondary: 'none',
defaultShadow: 'none', defaultShadow: 'none',
dangerShadow: 'none', dangerShadow: 'none',
primaryShadow: 'none' primaryShadow: 'none',
controlHeight: 30,
paddingInline: 10
},
Input: {
controlHeight: 30
},
Select: {
controlHeight: 30
}, },
Collapse: { Collapse: {
headerBg: 'transparent' headerBg: 'transparent'

1
src/renderer/src/pages/settings/DataSettings/AgentsSubscribeUrlSettings.tsx
View File

@ -39,7 +39,6 @@ const AgentsSubscribeUrlSettings: FC = () => {
/> />
</HStack> </HStack>
</SettingRow> </SettingRow>
<SettingDivider />
</SettingGroup> </SettingGroup>
) )
} }

19
src/renderer/src/pages/settings/DataSettings/JoplinSettings.tsx
View File

@ -4,7 +4,7 @@ import { useTheme } from '@renderer/context/ThemeProvider'
import { useMinappPopup } from '@renderer/hooks/useMinappPopup' import { useMinappPopup } from '@renderer/hooks/useMinappPopup'
import { RootState, useAppDispatch } from '@renderer/store' import { RootState, useAppDispatch } from '@renderer/store'
import { setJoplinExportReasoning, setJoplinToken, setJoplinUrl } from '@renderer/store/settings' import { setJoplinExportReasoning, setJoplinToken, setJoplinUrl } from '@renderer/store/settings'
import { Button, Switch, Tooltip } from 'antd' import { Button, Space, Switch, Tooltip } from 'antd'
import Input from 'antd/es/input/Input' import Input from 'antd/es/input/Input'
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
@ -106,14 +106,15 @@ const JoplinSettings: FC = () => {
</Tooltip> </Tooltip>
</SettingRowTitle> </SettingRowTitle>
<HStack alignItems="center" gap="5px" style={{ width: 315 }}> <HStack alignItems="center" gap="5px" style={{ width: 315 }}>
<Input <Space.Compact style={{ width: '100%' }}>
type="password" <Input
value={joplinToken || ''} type="password"
onChange={handleJoplinTokenChange} value={joplinToken || ''}
style={{ width: 250 }} onChange={handleJoplinTokenChange}
placeholder={t('settings.data.joplin.token_placeholder')} placeholder={t('settings.data.joplin.token_placeholder')}
/> />
<Button onClick={handleJoplinConnectionCheck}>{t('settings.data.joplin.check.button')}</Button> <Button onClick={handleJoplinConnectionCheck}>{t('settings.data.joplin.check.button')}</Button>
</Space.Compact>
</HStack> </HStack>
</SettingRow> </SettingRow>
<SettingDivider /> <SettingDivider />

21
src/renderer/src/pages/settings/DataSettings/NotionSettings.tsx
View File

@ -10,7 +10,7 @@ import {
setNotionExportReasoning, setNotionExportReasoning,
setNotionPageNameKey setNotionPageNameKey
} from '@renderer/store/settings' } from '@renderer/store/settings'
import { Button, Switch, Tooltip } from 'antd' import { Button, Space, Switch, Tooltip } from 'antd'
import Input from 'antd/es/input/Input' import Input from 'antd/es/input/Input'
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
@ -121,15 +121,16 @@ const NotionSettings: FC = () => {
<SettingRow> <SettingRow>
<SettingRowTitle>{t('settings.data.notion.api_key')}</SettingRowTitle> <SettingRowTitle>{t('settings.data.notion.api_key')}</SettingRowTitle>
<HStack alignItems="center" gap="5px" style={{ width: 315 }}> <HStack alignItems="center" gap="5px" style={{ width: 315 }}>
<Input <Space.Compact style={{ width: '100%' }}>
type="password" <Input
value={notionApiKey || ''} type="password"
onChange={handleNotionTokenChange} value={notionApiKey || ''}
onBlur={handleNotionTokenChange} onChange={handleNotionTokenChange}
style={{ width: 250 }} onBlur={handleNotionTokenChange}
placeholder={t('settings.data.notion.api_key_placeholder')} placeholder={t('settings.data.notion.api_key_placeholder')}
/> />
<Button onClick={handleNotionConnectionCheck}>{t('settings.data.notion.check.button')}</Button> <Button onClick={handleNotionConnectionCheck}>{t('settings.data.notion.check.button')}</Button>
</Space.Compact>
</HStack> </HStack>
</SettingRow> </SettingRow>
<SettingDivider /> <SettingDivider />

19
src/renderer/src/pages/settings/DataSettings/SiyuanSettings.tsx
View File

@ -4,7 +4,7 @@ import { useTheme } from '@renderer/context/ThemeProvider'
import { useMinappPopup } from '@renderer/hooks/useMinappPopup' import { useMinappPopup } from '@renderer/hooks/useMinappPopup'
import { RootState, useAppDispatch } from '@renderer/store' import { RootState, useAppDispatch } from '@renderer/store'
import { setSiyuanApiUrl, setSiyuanBoxId, setSiyuanRootPath, setSiyuanToken } from '@renderer/store/settings' import { setSiyuanApiUrl, setSiyuanBoxId, setSiyuanRootPath, setSiyuanToken } from '@renderer/store/settings'
import { Button, Tooltip } from 'antd' import { Button, Space, Tooltip } from 'antd'
import Input from 'antd/es/input/Input' import Input from 'antd/es/input/Input'
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
@ -108,14 +108,15 @@ const SiyuanSettings: FC = () => {
</Tooltip> </Tooltip>
</SettingRowTitle> </SettingRowTitle>
<HStack alignItems="center" gap="5px" style={{ width: 315 }}> <HStack alignItems="center" gap="5px" style={{ width: 315 }}>
<Input <Space.Compact style={{ width: '100%' }}>
type="password" <Input
value={siyuanToken || ''} type="password"
onChange={handleTokenChange} value={siyuanToken || ''}
style={{ width: 250 }} onChange={handleTokenChange}
placeholder={t('settings.data.siyuan.token_placeholder')} placeholder={t('settings.data.siyuan.token_placeholder')}
/> />
<Button onClick={handleCheckConnection}>{t('settings.data.siyuan.check.button')}</Button> <Button onClick={handleCheckConnection}>{t('settings.data.siyuan.check.button')}</Button>
</Space.Compact>
</HStack> </HStack>
</SettingRow> </SettingRow>
<SettingDivider /> <SettingDivider />

19
src/renderer/src/pages/settings/DataSettings/YuqueSettings.tsx
View File

@ -4,7 +4,7 @@ import { useTheme } from '@renderer/context/ThemeProvider'
import { useMinappPopup } from '@renderer/hooks/useMinappPopup' import { useMinappPopup } from '@renderer/hooks/useMinappPopup'
import { RootState, useAppDispatch } from '@renderer/store' import { RootState, useAppDispatch } from '@renderer/store'
import { setYuqueRepoId, setYuqueToken, setYuqueUrl } from '@renderer/store/settings' import { setYuqueRepoId, setYuqueToken, setYuqueUrl } from '@renderer/store/settings'
import { Button, Tooltip } from 'antd' import { Button, Space, Tooltip } from 'antd'
import Input from 'antd/es/input/Input' import Input from 'antd/es/input/Input'
import { FC } from 'react' import { FC } from 'react'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
@ -100,14 +100,15 @@ const YuqueSettings: FC = () => {
</Tooltip> </Tooltip>
</SettingRowTitle> </SettingRowTitle>
<HStack alignItems="center" gap="5px" style={{ width: 315 }}> <HStack alignItems="center" gap="5px" style={{ width: 315 }}>
<Input <Space.Compact style={{ width: '100%' }}>
type="password" <Input
value={yuqueToken || ''} type="password"
onChange={handleYuqueTokenChange} value={yuqueToken || ''}
style={{ width: 250 }} onChange={handleYuqueTokenChange}
placeholder={t('settings.data.yuque.token_placeholder')} placeholder={t('settings.data.yuque.token_placeholder')}
/> />
<Button onClick={handleYuqueConnectionCheck}>{t('settings.data.yuque.check.button')}</Button> <Button onClick={handleYuqueConnectionCheck}>{t('settings.data.yuque.check.button')}</Button>
</Space.Compact>
</HStack> </HStack>
</SettingRow> </SettingRow>
</SettingGroup> </SettingGroup>