imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Use the font slider

Browse source
This commit is contained in:
Jorik Schellekens 2020-04-16 10:33:44 +01:00
parent df73f12320
commit 8b72756b8d
1 changed files with 8 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/views/settings/tabs/user/StyleUserSettingsTab.js
View file

@ -20,6 +20,7 @@ import SettingsStore, {SettingLevel} from "../../../../../settings/SettingsStore
import * as sdk from "../../../../../index"; import * as sdk from "../../../../../index";
import {enumerateThemes, ThemeWatcher} from "../../../../../theme"; import {enumerateThemes, ThemeWatcher} from "../../../../../theme";
import Field from "../../../elements/Field"; import Field from "../../../elements/Field";
import FontSlider from "../../../../structures/FontSlider";
export default class StyleUserSettingsTab extends React.Component { export default class StyleUserSettingsTab extends React.Component {
constructor() { constructor() {
@ -219,11 +220,18 @@ export default class StyleUserSettingsTab extends React.Component {
_renderFontSection() { _renderFontSection() {
return <div className="mx_SettingsTab_section mx_StyleUserSettingsTab_fontScaling"> return <div className="mx_SettingsTab_section mx_StyleUserSettingsTab_fontScaling">
<span className="mx_SettingsTab_subheading">{_t("Font size")}</span> <span className="mx_SettingsTab_subheading">{_t("Font size")}</span>
<FontSlider
values={[12,14,16,18,20]}
value={this.state.fontSize}
updateFontSize={this._onFontSizeChanged}
displayFunc={value => value + 'px'}
/>
<Field <Field
type="text" type="text"
label={_t("Font size")} label={_t("Font size")}
autoComplete="off" autoComplete="off"
placeholder={SettingsStore.getValue("font_size", null).toString()} placeholder={SettingsStore.getValue("font_size", null).toString()}
value={this.state.fontSize}
id="font_size_field" id="font_size_field"
onChange={(ev) => this._onFontSizeChanged(ev.target.value)} onChange={(ev) => this._onFontSizeChanged(ev.target.value)}
/> />