Use semantic headings in space preferences (#11021)

* remove mx_SettingsTab_heading style

* use semantic headings in space preferences dialog

* remove unused settings style: mx_SettingsTab_subheading
This commit is contained in:
Kerry 2023-06-01 09:22:03 +12:00 committed by GitHub
parent 176daad49f
commit e9a8f4a11d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 31 additions and 69 deletions

View file

@ -27,6 +27,9 @@ import { SettingLevel } from "../../../settings/SettingLevel";
import RoomName from "../elements/RoomName";
import { SpacePreferenceTab } from "../../../dispatcher/payloads/OpenSpacePreferencesPayload";
import { NonEmptyArray } from "../../../@types/common";
import SettingsTab from "../settings/tabs/SettingsTab";
import { SettingsSection } from "../settings/shared/SettingsSection";
import SettingsSubsection, { SettingsSubsectionText } from "../settings/shared/SettingsSubsection";
interface IProps {
space: Room;
@ -38,34 +41,34 @@ const SpacePreferencesAppearanceTab: React.FC<Pick<IProps, "space">> = ({ space
const showPeople = useSettingValue("Spaces.showPeopleInSpace", space.roomId);
return (
<div className="mx_SettingsTab">
<div className="mx_SettingsTab_heading">{_t("Sections to show")}</div>
<div className="mx_SettingsTab_section">
<StyledCheckbox
checked={!!showPeople}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
SettingsStore.setValue(
"Spaces.showPeopleInSpace",
space.roomId,
SettingLevel.ROOM_ACCOUNT,
!showPeople,
);
}}
>
{_t("People")}
</StyledCheckbox>
<p>
{_t(
"This groups your chats with members of this space. " +
"Turning this off will hide those chats from your view of %(spaceName)s.",
{
spaceName: space.name,
},
)}
</p>
</div>
</div>
<SettingsTab>
<SettingsSection heading={_t("Sections to show")}>
<SettingsSubsection>
<StyledCheckbox
checked={!!showPeople}
onChange={(e: ChangeEvent<HTMLInputElement>) => {
SettingsStore.setValue(
"Spaces.showPeopleInSpace",
space.roomId,
SettingLevel.ROOM_ACCOUNT,
!showPeople,
);
}}
>
{_t("People")}
</StyledCheckbox>
<SettingsSubsectionText>
{_t(
"This groups your chats with members of this space. " +
"Turning this off will hide those chats from your view of %(spaceName)s.",
{
spaceName: space.name,
},
)}
</SettingsSubsectionText>
</SettingsSubsection>
</SettingsSection>
</SettingsTab>
);
};