xinyin025/ChatGPT-Next-Web
1
0
Fork 0
mirror of https://github.com/ChatGPTNextWeb/ChatGPT-Next-Web.git synced 2025-10-01 07:36:39 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Update settings.tsx

Browse Source 
display the font size number and example by the font size setting.
This commit is contained in:
leo 2023-03-29 21:58:45 +01:00
parent 8b4db412d8
commit b8222f5a1b
1 changed files with 31 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
app/components/settings.tsx
View File

@ -251,20 +251,37 @@ export function Settings(props: { closeSettings: () => void }) {
title={Locale.Settings.FontSize.Title} title={Locale.Settings.FontSize.Title}
subTitle={Locale.Settings.FontSize.SubTitle} subTitle={Locale.Settings.FontSize.SubTitle}
> >
<input <>
type="range" <span
title={`${config.fontSize ?? 14}px`} id="fontSizeDisplay"
value={config.fontSize} style={{ fontSize: `${config.fontSize ?? 14}px` }}
min="12" >
max="18" {config.fontSize ?? 14}px
step="1" </span>
onChange={(e) => <input
updateConfig( type="range"
(config) => title={`${config.fontSize ?? 14}px`}
(config.fontSize = Number.parseInt(e.currentTarget.value)), value={config.fontSize}
) min="12"
} max="18"
></input> step="1"
onChange={(e) =>
updateConfig(
(config) =>
(config.fontSize = Number.parseInt(
e.currentTarget.value,
)),
)
}
onMouseMove={(e) => {
const fontSizeDisplay =
document.getElementById("fontSizeDisplay");
if (fontSizeDisplay) {
fontSizeDisplay.innerText = `${e.currentTarget.value}px`;
}
}}
></input>
</>
</SettingItem> </SettingItem>
<div className="no-mobile"> <div className="no-mobile">