Use `strong` element to semantically denote visually emphasised content (#12320)
* 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>pull/28217/head
parent
91020b3d00
commit
26176116bf
|
@ -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: "";
|
||||
|
|
|
@ -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()) {
|
||||
|
|
|
@ -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}
|
||||
|
|
|
@ -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>,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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> {_t("terms|identity_server_no_terms_description_2")}</span>
|
||||
</div>
|
||||
),
|
||||
|
|
|
@ -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>
|
||||
|
||||
<span>{_t("labs_mjolnir|lists_description_2")}</span>
|
||||
</>
|
||||
|
|
|
@ -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.
|
||||
|
|
Loading…
Reference in New Issue