diff --git a/electron.vite.config.ts b/electron.vite.config.ts index 668c5c3e..a8e99cd9 100644 --- a/electron.vite.config.ts +++ b/electron.vite.config.ts @@ -16,6 +16,8 @@ export default defineConfig({ } }, plugins: [react()], - assetsInclude: ['**/*.md'] + server: { + hmr: false + } } }) diff --git a/src/renderer/src/assets/styles/index.scss b/src/renderer/src/assets/styles/index.scss index 6d677dc1..34ce4f7d 100644 --- a/src/renderer/src/assets/styles/index.scss +++ b/src/renderer/src/assets/styles/index.scss @@ -107,6 +107,7 @@ body { display: flex; min-height: 100vh; color: var(--color-text); + font-size: 14px; line-height: 1.6; overflow: hidden; background: transparent !important; diff --git a/src/renderer/src/assets/styles/markdown.scss b/src/renderer/src/assets/styles/markdown.scss index 572723b6..bc414168 100644 --- a/src/renderer/src/assets/styles/markdown.scss +++ b/src/renderer/src/assets/styles/markdown.scss @@ -1,6 +1,5 @@ .markdown { color: var(--color-text); - font-size: 15px; line-height: 1.6; user-select: text; word-break: break-word; diff --git a/src/renderer/src/components/app/Navbar.tsx b/src/renderer/src/components/app/Navbar.tsx index e2f6f5a7..7a71f85f 100644 --- a/src/renderer/src/components/app/Navbar.tsx +++ b/src/renderer/src/components/app/Navbar.tsx @@ -39,7 +39,6 @@ const NavbarLeftContainer = styled.div` display: flex; flex-direction: row; align-items: center; - font-size: 14px; font-weight: bold; color: var(--color-text-1); ` @@ -49,7 +48,6 @@ const NavbarCenterContainer = styled.div` display: flex; align-items: center; padding: 0 ${isMac ? '20px' : '15px'}; - font-size: 14px; font-weight: bold; color: var(--color-text-1); ` diff --git a/src/renderer/src/i18n/index.ts b/src/renderer/src/i18n/index.ts index 2f13444c..154ab71e 100644 --- a/src/renderer/src/i18n/index.ts +++ b/src/renderer/src/i18n/index.ts @@ -27,7 +27,8 @@ const resources = { save: 'Save', footnotes: 'References', select: 'Select', - search: 'Search' + search: 'Search', + default: 'Default' }, button: { add: 'Add', @@ -183,7 +184,8 @@ const resources = { 'theme.title': 'Theme', 'theme.dark': 'Dark', 'theme.light': 'Light', - 'theme.auto': 'Auto' + 'theme.auto': 'Auto', + 'font_size.title': 'Message Font Size' }, translate: { title: 'Translation', @@ -241,7 +243,8 @@ const resources = { you: '用户', footnote: '引用内容', select: '选择', - search: '搜索' + search: '搜索', + default: '默认' }, button: { add: '添加', @@ -336,7 +339,7 @@ const resources = { settings: { title: '设置', general: '常规设置', - provider: '模型提供商', + provider: '模型服务', model: '默认模型', assistant: '默认助手', about: '关于我们', @@ -398,7 +401,8 @@ const resources = { 'theme.title': '主题', 'theme.dark': '深色主题', 'theme.light': '浅色主题', - 'theme.auto': '跟随系统' + 'theme.auto': '跟随系统', + 'font_size.title': '消息字体大小' }, translate: { title: '翻译', diff --git a/src/renderer/src/pages/home/Assistants.tsx b/src/renderer/src/pages/home/Assistants.tsx index 6f1bb852..5c165e38 100644 --- a/src/renderer/src/pages/home/Assistants.tsx +++ b/src/renderer/src/pages/home/Assistants.tsx @@ -168,7 +168,6 @@ const AssistantItem = styled.div` ` const AssistantName = styled.div` - font-size: 14px; color: var(--color-text); display: -webkit-box; -webkit-line-clamp: 1; diff --git a/src/renderer/src/pages/home/Inputbar/Inputbar.tsx b/src/renderer/src/pages/home/Inputbar/Inputbar.tsx index 60915120..25ccc698 100644 --- a/src/renderer/src/pages/home/Inputbar/Inputbar.tsx +++ b/src/renderer/src/pages/home/Inputbar/Inputbar.tsx @@ -39,7 +39,7 @@ const Inputbar: FC = ({ assistant, setActiveTopic }) => { const [text, setText] = useState(_text) const [inputFocus, setInputFocus] = useState(false) const { addTopic } = useAssistant(assistant.id) - const { sendMessageShortcut, showInputEstimatedTokens } = useSettings() + const { sendMessageShortcut, showInputEstimatedTokens, fontSize } = useSettings() const [expended, setExpend] = useState(false) const [estimateTokenCount, setEstimateTokenCount] = useState(0) const generating = useAppSelector((state) => state.runtime.generating) @@ -230,6 +230,7 @@ const Inputbar: FC = ({ assistant, setActiveTopic }) => { styles={{ textarea: { paddingLeft: 0 } }} onFocus={() => setInputFocus(true)} onBlur={() => setInputFocus(false)} + style={{ fontSize }} /> ) diff --git a/src/renderer/src/pages/home/Message.tsx b/src/renderer/src/pages/home/Message.tsx index 4ccfc06d..bfa12e3f 100644 --- a/src/renderer/src/pages/home/Message.tsx +++ b/src/renderer/src/pages/home/Message.tsx @@ -38,7 +38,7 @@ const MessageItem: FC = ({ message, index, showMenu, onDeleteMessage }) = const avatar = useAvatar() const { t } = useTranslation() const { assistant, model, setModel } = useAssistant(message.assistantId) - const { userName, showMessageDivider, messageFont } = useSettings() + const { userName, showMessageDivider, messageFont, fontSize } = useSettings() const { generating } = useRuntime() const [copied, setCopied] = useState(false) @@ -135,7 +135,7 @@ const MessageItem: FC = ({ message, index, showMenu, onDeleteMessage }) = - + {showMenu && ( diff --git a/src/renderer/src/pages/home/RightSidebar/TopicsTab.tsx b/src/renderer/src/pages/home/RightSidebar/TopicsTab.tsx index cb59af50..3b173417 100644 --- a/src/renderer/src/pages/home/RightSidebar/TopicsTab.tsx +++ b/src/renderer/src/pages/home/RightSidebar/TopicsTab.tsx @@ -143,7 +143,6 @@ const TopicListItem = styled.div` padding: 7px 10px; cursor: pointer; border-radius: 8px; - font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; diff --git a/src/renderer/src/pages/settings/GeneralSettings.tsx b/src/renderer/src/pages/settings/GeneralSettings.tsx index 430bb0ff..77f7bd83 100644 --- a/src/renderer/src/pages/settings/GeneralSettings.tsx +++ b/src/renderer/src/pages/settings/GeneralSettings.tsx @@ -4,10 +4,10 @@ import i18n from '@renderer/i18n' import LocalStorage from '@renderer/services/storage' import { useAppDispatch } from '@renderer/store' import { setAvatar } from '@renderer/store/runtime' -import { setLanguage, setUserName, ThemeMode } from '@renderer/store/settings' +import { setFontSize, setLanguage, setUserName, ThemeMode } from '@renderer/store/settings' import { setProxyUrl as _setProxyUrl } from '@renderer/store/settings' import { compressImage, isValidProxyUrl } from '@renderer/utils' -import { Avatar, Input, Select, Upload } from 'antd' +import { Avatar, Input, Select, Slider, Upload } from 'antd' import { FC, useState } from 'react' import { useTranslation } from 'react-i18next' import styled from 'styled-components' @@ -16,7 +16,8 @@ import { SettingContainer, SettingDivider, SettingRow, SettingRowTitle, SettingT const GeneralSettings: FC = () => { const avatar = useAvatar() - const { language, proxyUrl: storeProxyUrl, userName, theme, setTheme } = useSettings() + const { language, proxyUrl: storeProxyUrl, userName, theme, setTheme, fontSize } = useSettings() + const [fontSizeValue, setFontSizeValue] = useState(fontSize) const [proxyUrl, setProxyUrl] = useState(storeProxyUrl) const dispatch = useAppDispatch() const { t } = useTranslation() @@ -100,6 +101,27 @@ const GeneralSettings: FC = () => { /> + + {t('settings.font_size.title')} + setFontSizeValue(value)} + onChangeComplete={(value) => { + dispatch(setFontSize(value)) + console.debug('set font size', value) + }} + min={12} + max={18} + step={1} + marks={{ + 12: A, + 14: {t('common.default')}, + 18: A + }} + /> + + {t('settings.proxy.title')} { - {t('settings.provider')} + + + {t('settings.provider')} + - {t('settings.model')} + + + {t('settings.model')} + - {t('settings.assistant')} + + + {t('settings.assistant')} + - {t('settings.general')} + + + {t('settings.general')} + - {t('settings.about')} + + + {t('settings.about')} + @@ -81,13 +103,20 @@ const MenuItemLink = styled(Link)` ` const MenuItem = styled.li` + display: flex; + flex-direction: row; + align-items: center; + gap: 8px; padding: 6px 10px; width: 100%; cursor: pointer; border-radius: 5px; - font-size: 14px; font-weight: 500; transition: all 0.2s ease-in-out; + .anticon { + font-size: 16px; + opacity: 0.8; + } &:hover { background: var(--color-primary-soft); } diff --git a/src/renderer/src/store/index.ts b/src/renderer/src/store/index.ts index 53529727..8084636a 100644 --- a/src/renderer/src/store/index.ts +++ b/src/renderer/src/store/index.ts @@ -22,7 +22,7 @@ const persistedReducer = persistReducer( { key: 'cherry-studio', storage, - version: 19, + version: 20, blacklist: ['runtime'], migrate }, diff --git a/src/renderer/src/store/migrate.ts b/src/renderer/src/store/migrate.ts index 0d90d1e2..d49c863f 100644 --- a/src/renderer/src/store/migrate.ts +++ b/src/renderer/src/store/migrate.ts @@ -287,6 +287,15 @@ const migrateConfig = { } } } + }, + '20': (state: RootState) => { + return { + ...state, + settings: { + ...state.settings, + fontSize: 14 + } + } } } diff --git a/src/renderer/src/store/settings.ts b/src/renderer/src/store/settings.ts index af7174d2..94e2265d 100644 --- a/src/renderer/src/store/settings.ts +++ b/src/renderer/src/store/settings.ts @@ -19,6 +19,7 @@ export interface SettingsState { messageFont: 'system' | 'serif' showInputEstimatedTokens: boolean theme: ThemeMode + fontSize: number } const initialState: SettingsState = { @@ -31,7 +32,8 @@ const initialState: SettingsState = { showMessageDivider: false, messageFont: 'system', showInputEstimatedTokens: false, - theme: ThemeMode.light + theme: ThemeMode.light, + fontSize: 14 } const settingsSlice = createSlice({ @@ -70,6 +72,9 @@ const settingsSlice = createSlice({ }, setTheme: (state, action: PayloadAction) => { state.theme = action.payload + }, + setFontSize: (state, action: PayloadAction) => { + state.fontSize = action.payload } } }) @@ -85,7 +90,8 @@ export const { setShowMessageDivider, setMessageFont, setShowInputEstimatedTokens, - setTheme + setTheme, + setFontSize } = settingsSlice.actions export default settingsSlice.reducer