PrivateCoffee/element-web
4
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

Fix clickable area of advanced toggle on appearance user settings tab (#8820)

Browse source
This commit is contained in:
Suguru Hirahara 2022-06-12 11:13:41 +00:00 committed by GitHub
parent b5e18064ab
commit 89743c9321
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
res/css/views/settings/tabs/user/_AppearanceUserSettingsTab.scss
View file

@ -32,11 +32,6 @@ limitations under the License.
margin-bottom: 16px; margin-bottom: 16px;
} }
.mx_AppearanceUserSettingsTab_AdvancedToggle {
color: $accent;
cursor: pointer;
}
.mx_AppearanceUserSettingsTab_systemFont { .mx_AppearanceUserSettingsTab_systemFont {
margin-left: calc($font-16px + 10px); margin-left: calc($font-16px + 10px);
} }

7
src/components/views/settings/tabs/user/AppearanceUserSettingsTab.tsx
View file

@ -23,6 +23,7 @@ import { MatrixClientPeg } from '../../../../../MatrixClientPeg';
import SettingsStore from "../../../../../settings/SettingsStore"; import SettingsStore from "../../../../../settings/SettingsStore";
import SettingsFlag from '../../../elements/SettingsFlag'; import SettingsFlag from '../../../elements/SettingsFlag';
import Field from '../../../elements/Field'; import Field from '../../../elements/Field';
import AccessibleButton from "../../../elements/AccessibleButton";
import { SettingLevel } from "../../../../../settings/SettingLevel"; import { SettingLevel } from "../../../../../settings/SettingLevel";
import { UIFeature } from "../../../../../settings/UIFeature"; import { UIFeature } from "../../../../../settings/UIFeature";
import { Layout } from "../../../../../settings/enums/Layout"; import { Layout } from "../../../../../settings/enums/Layout";
@ -90,12 +91,12 @@ export default class AppearanceUserSettingsTab extends React.Component<IProps, I
if (!SettingsStore.getValue(UIFeature.AdvancedSettings)) return null; if (!SettingsStore.getValue(UIFeature.AdvancedSettings)) return null;
const brand = SdkConfig.get().brand; const brand = SdkConfig.get().brand;
const toggle = <div const toggle = <AccessibleButton
className="mx_AppearanceUserSettingsTab_AdvancedToggle" kind="link"
onClick={() => this.setState({ showAdvanced: !this.state.showAdvanced })} onClick={() => this.setState({ showAdvanced: !this.state.showAdvanced })}
> >
{ this.state.showAdvanced ? _t("Hide advanced") : _t("Show advanced") } { this.state.showAdvanced ? _t("Hide advanced") : _t("Show advanced") }
</div>; </AccessibleButton>;
let advanced: React.ReactNode; let advanced: React.ReactNode;