Merge pull request #4733 from matrix-org/joriks/font-scaling-appearance

Clean up font scaling appearance
pull/21833/head
Jorik Schellekens 2020-06-09 13:16:15 +01:00 committed by GitHub
commit 7a3ed0e496
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 2 deletions

View File

@ -43,3 +43,7 @@ limitations under the License.
padding-left: 20px;
padding-right: 5px;
}
.mx_SettingsTab_customFontSizeField {
margin-left: calc($font-16px + 10px);
}

View File

@ -281,7 +281,7 @@ export default class AppearanceUserSettingsTab extends React.Component<IProps, I
values={[13, 15, 16, 18, 20]}
value={parseInt(this.state.fontSize, 10)}
onSelectionChange={this.onFontSizeChanged}
displayFunc={value => ""}
displayFunc={_ => ""}
disabled={this.state.useCustomFontSize}
/>
<div className="mx_AppearanceUserSettingsTab_fontSlider_largeText">Aa</div>
@ -290,9 +290,10 @@ export default class AppearanceUserSettingsTab extends React.Component<IProps, I
name="useCustomFontSize"
level={SettingLevel.ACCOUNT}
onChange={(checked) => this.setState({useCustomFontSize: checked})}
useCheckbox={true}
/>
<Field
type="text"
type="number"
label={_t("Font size")}
autoComplete="off"
placeholder={this.state.fontSize.toString()}
@ -301,6 +302,7 @@ export default class AppearanceUserSettingsTab extends React.Component<IProps, I
onValidate={this.onValidateFontSize}
onChange={(value) => this.setState({fontSize: value.target.value})}
disabled={!this.state.useCustomFontSize}
className="mx_SettingsTab_customFontSizeField"
/>
</div>;
}