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

Use strong element to semantically denote visually emphasised content (#12320)

Browse source 
* Use `strong` element to semantically denote visually emphasised content

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Add comment

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-03-06 23:34:14 +00:00 committed by GitHub
parent 91020b3d00
commit 26176116bf
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
8 changed files with 23 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
res/css/views/dialogs/security/_AccessSecretStorageDialog.pcss
View file

@ -117,6 +117,8 @@ limitations under the License.
.mx_AccessSecretStorageDialog_reset {
position: relative;
padding-inline-start: $spacingStart;
/* To avoid bold styling inherent with <strong> elements */
font-weight: inherit;
&::before {
content: "";

4
src/async-components/views/dialogs/security/NewRecoveryMethodDialog.tsx
View file

@ -63,7 +63,9 @@ export default class NewRecoveryMethodDialog extends React.PureComponent<IProps>
const newMethodDetected = <p>{_t("encryption|new_recovery_method_detected|description_1")}</p>;
const hackWarning = <p className="warning">{_t("encryption|new_recovery_method_detected|warning")}</p>;
const hackWarning = (
<strong className="warning">{_t("encryption|new_recovery_method_detected|warning")}</strong>
);
let content: JSX.Element | undefined;
if (MatrixClientPeg.safeGet().getKeyBackupEnabled()) {

2
src/async-components/views/dialogs/security/RecoveryMethodRemovedDialog.tsx
View file

@ -55,7 +55,7 @@ export default class RecoveryMethodRemovedDialog extends React.PureComponent<IPr
<div>
<p>{_t("encryption|recovery_method_removed|description_1")}</p>
<p>{_t("encryption|recovery_method_removed|description_2")}</p>
<p className="warning">{_t("encryption|recovery_method_removed|warning")}</p>
<strong className="warning">{_t("encryption|recovery_method_removed|warning")}</strong>
<DialogButtons
primaryButton={_t("common|setup_secure_messages")}
onPrimaryButtonClick={this.onSetupClick}

8
src/components/structures/MatrixChat.tsx
View file

@ -1176,10 +1176,10 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
const memberCount = roomToLeave?.currentState.getJoinedMemberCount();
if (memberCount === 1) {
warnings.push(
<span className="warning" key="only_member_warning">
<strong className="warning" key="only_member_warning">
{" " /* Whitespace, otherwise the sentences get smashed together */}
{_t("leave_room_dialog|last_person_warning")}
</span>,
</strong>,
);
return warnings;
@ -1190,12 +1190,12 @@ export default class MatrixChat extends React.PureComponent<IProps, IState> {
const rule = joinRules.getContent().join_rule;
if (rule !== "public") {
warnings.push(
<span className="warning" key="non_public_warning">
<strong className="warning" key="non_public_warning">
{" " /* Whitespace, otherwise the sentences get smashed together */}
{isSpace
? _t("leave_room_dialog|space_rejoin_warning")
: _t("leave_room_dialog|room_rejoin_warning")}
</span>,
</strong>,
);
}
}

10
src/components/views/dialogs/security/AccessSecretStorageDialog.tsx
View file

@ -278,8 +278,8 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
public render(): React.ReactNode {
const hasPassphrase = this.props.keyInfo?.passphrase?.salt && this.props.keyInfo?.passphrase?.iterations;
const resetButton = (
<div className="mx_AccessSecretStorageDialog_reset">
const resetLine = (
<strong className="mx_AccessSecretStorageDialog_reset">
{_t("encryption|reset_all_button", undefined, {
a: (sub) => (
<AccessibleButton
@ -291,7 +291,7 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
</AccessibleButton>
),
})}
</div>
</strong>
);
let content;
@ -366,7 +366,7 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
onCancel={this.onCancel}
focus={false}
primaryDisabled={this.state.passPhrase.length === 0}
additive={resetButton}
additive={resetLine}
/>
</form>
</div>
@ -434,7 +434,7 @@ export default class AccessSecretStorageDialog extends React.PureComponent<IProp
onCancel={this.onCancel}
focus={false}
primaryDisabled={!this.state.recoveryKeyValid}
additive={resetButton}
additive={resetLine}
/>
</form>
</div>

4
src/components/views/settings/SetIdServer.tsx
View file

@ -137,7 +137,7 @@ export default class SetIdServer extends React.Component<IProps, IState> {
</div>
);
} else if (this.state.error) {
return <span className="warning">{this.state.error}</span>;
return <strong className="warning">{this.state.error}</strong>;
} else {
return null;
}
@ -226,7 +226,7 @@ export default class SetIdServer extends React.Component<IProps, IState> {
title: _t("terms|identity_server_no_terms_title"),
description: (
<div>
<span className="warning">{_t("identity_server|no_terms")}</span>
<strong className="warning">{_t("identity_server|no_terms")}</strong>
<span>&nbsp;{_t("terms|identity_server_no_terms_description_2")}</span>
</div>
),

4
src/components/views/settings/tabs/user/MjolnirUserSettingsTab.tsx
View file

@ -256,7 +256,7 @@ export default class MjolnirUserSettingsTab extends React.Component<{}, IState>
<SettingsTab>
<SettingsSection heading={_t("labs_mjolnir|title")}>
<SettingsSubsectionText>
<span className="warning">{_t("labs_mjolnir|advanced_warning")}</span>
<strong className="warning">{_t("labs_mjolnir|advanced_warning")}</strong>
<p>{_t("labs_mjolnir|explainer_1", { brand }, { code: (s) => <code>{s}</code> })}</p>
<p>{_t("labs_mjolnir|explainer_2")}</p>
</SettingsSubsectionText>
@ -289,7 +289,7 @@ export default class MjolnirUserSettingsTab extends React.Component<{}, IState>
heading={_t("labs_mjolnir|lists_heading")}
description={
<>
<span className="warning">{_t("labs_mjolnir|lists_description_1")}</span>
<strong className="warning">{_t("labs_mjolnir|lists_description_1")}</strong>
&nbsp;
<span>{_t("labs_mjolnir|lists_description_2")}</span>
</>

8
test/components/views/settings/tabs/user/__snapshots__/MjolnirUserSettingsTab-test.tsx.snap
View file

@ -22,11 +22,11 @@ exports[`<MjolnirUserSettingsTab /> renders correctly when user has no ignored u
<div
class="mx_SettingsSubsection_text"
>
<span
<strong
class="warning"
>
⚠ These settings are meant for advanced users.
</span>
</strong>
<p>
<span>
Add users and servers you want to ignore here. Use asterisks to have Element match any characters. For example,
@ -115,11 +115,11 @@ exports[`<MjolnirUserSettingsTab /> renders correctly when user has no ignored u
<div
class="mx_SettingsSubsection_text"
>
<span
<strong
class="warning"
>
Subscribing to a ban list will cause you to join it!
</span>
</strong>
 
<span>
If this isn't what you want, please use a different tool to ignore users.