Use semantic headings in user settings Appearance (#10827)
* split SettingsSection out of SettingsTab, replace usage * correct copyright * use semantic headings in GeneralRoomSettingsTab * use SettingsTab and SettingsSubsection in room settings * fix VoipRoomSettingsTab * use SettingsSection components in space settings * settingssubsection text component * use semantic headings in HelpUserSetttings tab * use ExternalLink components for external links * test * strict * lint * semantic heading in labs settings * semantic headings in keyboard settings tab * semantic heading in preferencesusersettingstab * tidying * use new settings components in eventindexpanel * findByTestId * prettier * semantic headings and style refresh for crypto settings * e2e panel * use semantic headings in User settings appearance tab * update selectors in tests * tidy
This commit is contained in:
parent
e652177706
commit
b3b03e5dcb
18 changed files with 765 additions and 770 deletions
|
@ -28,6 +28,7 @@ import { MatrixClientPeg } from "../../../MatrixClientPeg";
|
|||
import { SettingLevel } from "../../../settings/SettingLevel";
|
||||
import { _t } from "../../../languageHandler";
|
||||
import { clamp } from "../../../utils/numbers";
|
||||
import SettingsSubsection from "./shared/SettingsSubsection";
|
||||
|
||||
interface IProps {}
|
||||
|
||||
|
@ -108,8 +109,7 @@ export default class FontScalingPanel extends React.Component<IProps, IState> {
|
|||
const max = 18;
|
||||
|
||||
return (
|
||||
<div className="mx_SettingsTab_section mx_FontScalingPanel">
|
||||
<span className="mx_SettingsTab_subheading">{_t("Font size")}</span>
|
||||
<SettingsSubsection heading={_t("Font size")} stretchContent data-testid="mx_FontScalingPanel">
|
||||
<EventTilePreview
|
||||
className="mx_FontScalingPanel_preview"
|
||||
message={this.MESSAGE_PREVIEW_TEXT}
|
||||
|
@ -159,9 +159,9 @@ export default class FontScalingPanel extends React.Component<IProps, IState> {
|
|||
onValidate={this.onValidateFontSize}
|
||||
onChange={(value: ChangeEvent<HTMLInputElement>) => this.setState({ fontSize: value.target.value })}
|
||||
disabled={!this.state.useCustomFontSize}
|
||||
className="mx_FontScalingPanel_customFontSizeField"
|
||||
className="mx_AppearanceUserSettingsTab_checkboxControlledField"
|
||||
/>
|
||||
</div>
|
||||
</SettingsSubsection>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue