forked from XiaoMo/ChatGPT-Next-Web
feat: add font size setting
This commit is contained in:
parent
cfbe6d77b5
commit
f979822508
@ -178,6 +178,7 @@ export function Chat(props: { showSideBar?: () => void }) {
|
|||||||
state.currentSession(),
|
state.currentSession(),
|
||||||
state.currentSessionIndex,
|
state.currentSessionIndex,
|
||||||
]);
|
]);
|
||||||
|
const fontSize = useChatStore((state) => state.config.fontSize);
|
||||||
|
|
||||||
const inputRef = useRef<HTMLTextAreaElement>(null);
|
const inputRef = useRef<HTMLTextAreaElement>(null);
|
||||||
const [userInput, setUserInput] = useState("");
|
const [userInput, setUserInput] = useState("");
|
||||||
@ -406,6 +407,7 @@ export function Chat(props: { showSideBar?: () => void }) {
|
|||||||
) : (
|
) : (
|
||||||
<div
|
<div
|
||||||
className="markdown-body"
|
className="markdown-body"
|
||||||
|
style={{ fontSize: `${fontSize}px` }}
|
||||||
onContextMenu={(e) => onRightClick(e, message)}
|
onContextMenu={(e) => onRightClick(e, message)}
|
||||||
>
|
>
|
||||||
<Markdown content={message.content} />
|
<Markdown content={message.content} />
|
||||||
|
@ -226,6 +226,26 @@ export function Settings(props: { closeSettings: () => void }) {
|
|||||||
</select>
|
</select>
|
||||||
</SettingItem>
|
</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">
|
<div className="no-mobile">
|
||||||
<SettingItem title={Locale.Settings.TightBorder}>
|
<SettingItem title={Locale.Settings.TightBorder}>
|
||||||
<input
|
<input
|
||||||
|
@ -51,6 +51,10 @@ const cn = {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
Avatar: "头像",
|
Avatar: "头像",
|
||||||
|
FontSize: {
|
||||||
|
Title: "字体大小",
|
||||||
|
SubTitle: "聊天内容的字体大小",
|
||||||
|
},
|
||||||
Update: {
|
Update: {
|
||||||
Version: (x: string) => `当前版本:${x}`,
|
Version: (x: string) => `当前版本:${x}`,
|
||||||
IsLatest: "已是最新版本",
|
IsLatest: "已是最新版本",
|
||||||
|
@ -55,6 +55,10 @@ const en: LocaleType = {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
Avatar: "Avatar",
|
Avatar: "Avatar",
|
||||||
|
FontSize: {
|
||||||
|
Title: "Font Size",
|
||||||
|
SubTitle: "Adjust font size of chat content",
|
||||||
|
},
|
||||||
Update: {
|
Update: {
|
||||||
Version: (x: string) => `Version: ${x}`,
|
Version: (x: string) => `Version: ${x}`,
|
||||||
IsLatest: "Latest version",
|
IsLatest: "Latest version",
|
||||||
|
@ -53,6 +53,10 @@ const tw: LocaleType = {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
Avatar: "大頭貼",
|
Avatar: "大頭貼",
|
||||||
|
FontSize: {
|
||||||
|
Title: "字型大小",
|
||||||
|
SubTitle: "聊天內容的字型大小",
|
||||||
|
},
|
||||||
Update: {
|
Update: {
|
||||||
Version: (x: string) => `當前版本:${x}`,
|
Version: (x: string) => `當前版本:${x}`,
|
||||||
IsLatest: "已是最新版本",
|
IsLatest: "已是最新版本",
|
||||||
|
@ -31,12 +31,12 @@ export enum Theme {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface ChatConfig {
|
export interface ChatConfig {
|
||||||
maxToken?: number;
|
|
||||||
historyMessageCount: number; // -1 means all
|
historyMessageCount: number; // -1 means all
|
||||||
compressMessageLengthThreshold: number;
|
compressMessageLengthThreshold: number;
|
||||||
sendBotMessages: boolean; // send bot's message or not
|
sendBotMessages: boolean; // send bot's message or not
|
||||||
submitKey: SubmitKey;
|
submitKey: SubmitKey;
|
||||||
avatar: string;
|
avatar: string;
|
||||||
|
fontSize: number;
|
||||||
theme: Theme;
|
theme: Theme;
|
||||||
tightBorder: boolean;
|
tightBorder: boolean;
|
||||||
|
|
||||||
@ -123,6 +123,7 @@ const DEFAULT_CONFIG: ChatConfig = {
|
|||||||
sendBotMessages: true as boolean,
|
sendBotMessages: true as boolean,
|
||||||
submitKey: SubmitKey.CtrlEnter as SubmitKey,
|
submitKey: SubmitKey.CtrlEnter as SubmitKey,
|
||||||
avatar: "1f603",
|
avatar: "1f603",
|
||||||
|
fontSize: 14,
|
||||||
theme: Theme.Auto as Theme,
|
theme: Theme.Auto as Theme,
|
||||||
tightBorder: false,
|
tightBorder: false,
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user