Merge pull request ChatGPTNextWeb#89 from iFwu/main

feat: add font size config
yxl · Mar 29, 2023 · a075c0d · a075c0d
2 parents a6f3692 + 5f3fcc5
commit a075c0d
Show file tree

Hide file tree

Showing 6 changed files with 36 additions and 1 deletion.
diff --git a/app/components/home.tsx b/app/components/home.tsx
@@ -178,6 +178,7 @@ export function Chat(props: { showSideBar?: () => void }) {
     state.currentSession(),
     state.currentSessionIndex,
   ]);
+  const fontSize = useChatStore((state) => state.config.fontSize);
 
   const inputRef = useRef<HTMLTextAreaElement>(null);
   const [userInput, setUserInput] = useState("");
@@ -406,6 +407,7 @@ export function Chat(props: { showSideBar?: () => void }) {
                   ) : (
                     <div
                       className="markdown-body"
+                      style={{ fontSize: `${fontSize}px` }}
                       onContextMenu={(e) => onRightClick(e, message)}
                     >
                       <Markdown content={message.content} />

diff --git a/app/components/settings.tsx b/app/components/settings.tsx
@@ -226,6 +226,26 @@ export function Settings(props: { closeSettings: () => void }) {
             </select>
           </SettingItem>
 
+          <SettingItem
+            title={Locale.Settings.FontSize.Title}
+            subTitle={Locale.Settings.FontSize.SubTitle}
+          >
+            <input
+              type="range"
+              title={config.fontSize.toString() + 'px'}
+              value={config.fontSize}
+              min="12"
+              max="18"
+              step="1"
+              onChange={(e) =>
+                updateConfig(
+                  (config) =>
+                    (config.fontSize = Number.parseInt(e.currentTarget.value))
+                )
+              }
+            ></input>
+          </SettingItem>
+
           <div className="no-mobile">
             <SettingItem title={Locale.Settings.TightBorder}>
               <input

diff --git a/app/locales/cn.ts b/app/locales/cn.ts
@@ -51,6 +51,10 @@ const cn = {
       },
     },
     Avatar: "头像",
+    FontSize: {
+      Title: "字体大小",
+      SubTitle: "聊天内容的字体大小",
+    },
     Update: {
       Version: (x: string) => `当前版本：${x}`,
       IsLatest: "已是最新版本",

diff --git a/app/locales/en.ts b/app/locales/en.ts
@@ -55,6 +55,10 @@ const en: LocaleType = {
       },
     },
     Avatar: "Avatar",
+    FontSize: {
+      Title: "Font Size",
+      SubTitle: "Adjust font size of chat content",
+    },
     Update: {
       Version: (x: string) => `Version: ${x}`,
       IsLatest: "Latest version",

diff --git a/app/locales/tw.ts b/app/locales/tw.ts
@@ -53,6 +53,10 @@ const tw: LocaleType = {
       },
     },
     Avatar: "大頭貼",
+    FontSize: {
+      Title: "字型大小",
+      SubTitle: "聊天內容的字型大小",
+    },
     Update: {
       Version: (x: string) => `當前版本：${x}`,
       IsLatest: "已是最新版本",

diff --git a/app/store/app.ts b/app/store/app.ts
@@ -31,12 +31,12 @@ export enum Theme {
 }
 
 export interface ChatConfig {
-  maxToken?: number;
   historyMessageCount: number; // -1 means all
   compressMessageLengthThreshold: number;
   sendBotMessages: boolean; // send bot's message or not
   submitKey: SubmitKey;
   avatar: string;
+  fontSize: number;
   theme: Theme;
   tightBorder: boolean;
 
@@ -123,6 +123,7 @@ const DEFAULT_CONFIG: ChatConfig = {
   sendBotMessages: true as boolean,
   submitKey: SubmitKey.CtrlEnter as SubmitKey,
   avatar: "1f603",
+  fontSize: 14,
   theme: Theme.Auto as Theme,
   tightBorder: false,