Merge pull request #41 from element-hq/t3chguy/wat/230.1

res/css/views/auth/_AuthBody.pcss

@@ -16,7 +16,7 @@ Please see LICENSE files in the repository root for full details.
     padding: 25px 60px;
     box-sizing: border-box;
 
-    b {
+    strong {
         font-weight: var(--cpd-font-weight-semibold);
     }
 

src/IdentityAuthClient.tsx

@@ -141,7 +141,7 @@ export default class IdentityAuthClient {
                                 "terms|identity_server_no_terms_description_1",
                                 {},
                                 {
-                                    server: () => <b>{abbreviateUrl(identityServerUrl)}</b>,
+                                    server: () => <strong>{abbreviateUrl(identityServerUrl)}</strong>,
                                 },
                             )}
                         </p>

src/RoomInvite.tsx

@@ -145,7 +145,7 @@ export function showAnyInviteErrors(
                             "invite|room_failed_partial",
                             {},
                             {
-                                RoomName: () => <b>{room.name}</b>,
+                                RoomName: () => <strong>{room.name}</strong>,
                             },
                         )}
                     </h4>

src/components/structures/auth/forgot-password/CheckEmail.tsx

@@ -46,7 +46,7 @@ export const CheckEmail: React.FC<CheckEmailProps> = ({
             <EMailPromptIcon className="mx_AuthBody_emailPromptIcon--shifted" />
             <h1>{_t("auth|uia|email_auth_header")}</h1>
             <div className="mx_AuthBody_text">
-                <p>{_t("auth|check_email_explainer", { email: email }, { b: (t) => <b>{t}</b> })}</p>
+                <p>{_t("auth|check_email_explainer", { email: email }, { b: (t) => <strong>{t}</strong> })}</p>
                 <div className="mx_AuthBody_did-not-receive">
                     <span className="mx_VerifyEMailDialog_text-light">{_t("auth|check_email_wrong_email_prompt")}</span>
                     <AccessibleButton className="mx_AuthBody_resend-button" kind="link" onClick={onReEnterEmailClick}>

src/components/structures/auth/forgot-password/EnterEmail.tsx

@@ -57,7 +57,7 @@ export const EnterEmail: React.FC<EnterEmailProps> = ({
             <EmailIcon className="mx_AuthBody_icon" />
             <h1>{_t("auth|enter_email_heading")}</h1>
             <p className="mx_AuthBody_text">
-                {_t("auth|enter_email_explainer", { homeserver }, { b: (t) => <b>{t}</b> })}
+                {_t("auth|enter_email_explainer", { homeserver }, { b: (t) => <strong>{t}</strong> })}
             </p>
             <form onSubmit={onSubmit}>
                 <fieldset disabled={loading}>

src/components/structures/auth/forgot-password/VerifyEmailModal.tsx

@@ -50,7 +50,7 @@ export const VerifyEmailModal: React.FC<Props> = ({
                         email,
                     },
                     {
-                        b: (sub) => <b>{sub}</b>,
+                        b: (sub) => <strong>{sub}</strong>,
                     },
                 )}
             </p>

src/components/views/auth/InteractiveAuthEntryComponents.tsx

@@ -468,7 +468,7 @@ export class EmailIdentityAuthEntry extends React.Component<
                     />
                     <p>
                         {_t("auth|uia|email", {
-                            emailAddress: <b>{this.props.inputs.emailAddress}</b>,
+                            emailAddress: <strong>{this.props.inputs.emailAddress}</strong>,
                         })}
                     </p>
                     {this.state.requesting ? (

src/components/views/auth/LoginWithQRFlow.tsx

@@ -293,7 +293,7 @@ export default class LoginWithQRFlow extends React.Component<XOR<Props, MSC3906P
                                 </li>
                                 <li>
                                     {_t("auth|qr_code_login|select_qr_code", {
-                                        scanQRCode: <b>{_t("auth|qr_code_login|scan_qr_code")}</b>,
+                                        scanQRCode: <strong>{_t("auth|qr_code_login|scan_qr_code")}</strong>,
                                     })}
                                 </li>
                                 <li>{_t("auth|qr_code_login|point_the_camera")}</li>

src/components/views/dialogs/AnalyticsLearnMoreDialog.tsx

@@ -72,8 +72,8 @@ export const AnalyticsLearnMoreDialog: React.FC<IProps> = ({
                     {_t("analytics|pseudonymous_usage_data", { analyticsOwner })}
                 </div>
                 <ul className="mx_AnalyticsLearnMore_bullets">
-                    <li>{_t("analytics|bullet_1", {}, { Bold: (sub) => <b>{sub}</b> })}</li>
+                    <li>{_t("analytics|bullet_1", {}, { Bold: (sub) => <strong>{sub}</strong> })}</li>
-                    <li>{_t("analytics|bullet_2", {}, { Bold: (sub) => <b>{sub}</b> })}</li>
+                    <li>{_t("analytics|bullet_2", {}, { Bold: (sub) => <strong>{sub}</strong> })}</li>
                     <li>{_t("analytics|disable_prompt")}</li>
                 </ul>
                 {privacyPolicyLink}

src/components/views/dialogs/BugReportDialog.tsx

@@ -205,7 +205,7 @@ export default class BugReportDialog extends React.Component<IProps, IState> {
         ) {
             warning = (
                 <p>
-                    <b>{_t("bug_reporting|unsupported_browser")}</b>
+                    <strong>{_t("bug_reporting|unsupported_browser")}</strong>
                 </p>
             );
         }
@@ -221,7 +221,7 @@ export default class BugReportDialog extends React.Component<IProps, IState> {
                     {warning}
                     <p>{_t("bug_reporting|description")}</p>
                     <p>
-                        <b>
+                        <strong>
                             {_t(
                                 "bug_reporting|before_submitting",
                                 {},
@@ -237,7 +237,7 @@ export default class BugReportDialog extends React.Component<IProps, IState> {
                                     ),
                                 },
                             )}
-                        </b>
+                        </strong>
                     </p>
 
                     <div className="mx_BugReportDialog_download">

src/components/views/dialogs/CreateRoomDialog.tsx

@@ -280,7 +280,9 @@ export default class CreateRoomDialog extends React.Component<IProps, IState> {
                         "create_room|join_rule_restricted_label",
                         {},
                         {
-                            SpaceName: () => <b>{this.props.parentSpace?.name ?? _t("common|unnamed_space")}</b>,
+                            SpaceName: () => (
+                                <strong>{this.props.parentSpace?.name ?? _t("common|unnamed_space")}</strong>
+                            ),
                         },
                     )}
                     &nbsp;
@@ -294,7 +296,9 @@ export default class CreateRoomDialog extends React.Component<IProps, IState> {
                         "create_room|join_rule_public_parent_space_label",
                         {},
                         {
-                            SpaceName: () => <b>{this.props.parentSpace?.name ?? _t("common|unnamed_space")}</b>,
+                            SpaceName: () => (
+                                <strong>{this.props.parentSpace?.name ?? _t("common|unnamed_space")}</strong>
+                            ),
                         },
                     )}
                     &nbsp;

src/components/views/dialogs/CreateSubspaceDialog.tsx

@@ -95,7 +95,7 @@ const CreateSubspaceDialog: React.FC<IProps> = ({ space, onAddExistingSpaceClick
                     "create_space|subspace_join_rule_restricted_description",
                     {},
                     {
-                        SpaceName: () => <b>{parentSpace.name}</b>,
+                        SpaceName: () => <strong>{parentSpace.name}</strong>,
                     },
                 )}
             </p>
@@ -107,7 +107,7 @@ const CreateSubspaceDialog: React.FC<IProps> = ({ space, onAddExistingSpaceClick
                     "create_space|subspace_join_rule_public_description",
                     {},
                     {
-                        SpaceName: () => <b>{parentSpace.name}</b>,
+                        SpaceName: () => <strong>{parentSpace.name}</strong>,
                     },
                 )}
             </p>

src/components/views/dialogs/LeaveSpaceDialog.tsx

@@ -77,7 +77,7 @@ const LeaveSpaceDialog: React.FC<IProps> = ({ space, onFinished }) => {
                         "space|leave_dialog_description",
                         {},
                         {
-                            spaceName: () => <b>{space.name}</b>,
+                            spaceName: () => <strong>{space.name}</strong>,
                         },
                     )}
                     &nbsp;

src/components/views/dialogs/ManageRestrictedJoinRuleDialog.tsx

@@ -144,7 +144,7 @@ const ManageRestrictedJoinRuleDialog: React.FC<IProps> = ({ room, selected = [],
                     "room_settings|security|join_rule_restricted_dialog_description",
                     {},
                     {
-                        RoomName: () => <b>{room.name}</b>,
+                        RoomName: () => <strong>{room.name}</strong>,
                     },
                 )}
             </p>

src/components/views/dialogs/ManualDeviceKeyVerificationDialog.tsx

@@ -69,7 +69,7 @@ export function ManualDeviceKeyVerificationDialog({
                         <label>{_t("encryption|verification|manual_device_verification_device_key_label")}:</label>{" "}
                         <span>
                             <code>
-                                <b>{key}</b>
+                                <strong>{key}</strong>
                             </code>
                         </span>
                     </li>

src/components/views/dialogs/RegistrationEmailPromptDialog.tsx

@@ -54,7 +54,7 @@ const RegistrationEmailPromptDialog: React.FC<IProps> = ({ onFinished }) => {
                         "auth|registration|continue_without_email_description",
                         {},
                         {
-                            b: (sub) => <b>{sub}</b>,
+                            b: (sub) => <strong>{sub}</strong>,
                         },
                     )}
                 </p>

src/components/views/dialogs/RoomUpgradeWarningDialog.tsx

@@ -181,7 +181,7 @@ export default class RoomUpgradeWarningDialog extends React.Component<IProps, IS
                             "room_settings|advanced|upgrade_warning_dialog_explainer",
                             {},
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         )}
                     </p>

src/components/views/dialogs/UploadFailureDialog.tsx

@@ -46,7 +46,7 @@ export default class UploadFailureDialog extends React.Component<IProps> {
                     sizeOfThisFile: fileSize(this.props.badFiles[0].size),
                 },
                 {
-                    b: (sub) => <b>{sub}</b>,
+                    b: (sub) => <strong>{sub}</strong>,
                 },
             );
             buttons = (
@@ -64,7 +64,7 @@ export default class UploadFailureDialog extends React.Component<IProps> {
                     limit: fileSize(this.props.contentMessages.getUploadLimit()!),
                 },
                 {
-                    b: (sub) => <b>{sub}</b>,
+                    b: (sub) => <strong>{sub}</strong>,
                 },
             );
             buttons = (
@@ -82,7 +82,7 @@ export default class UploadFailureDialog extends React.Component<IProps> {
                     limit: fileSize(this.props.contentMessages.getUploadLimit()!),
                 },
                 {
-                    b: (sub) => <b>{sub}</b>,
+                    b: (sub) => <strong>{sub}</strong>,
                 },
             );
             const howManyOthers = this.props.totalFiles - this.props.badFiles.length;

src/components/views/dialogs/devtools/SettingExplorer.tsx

@@ -128,7 +128,7 @@ const EditSetting: React.FC<IEditSettingProps> = ({ setting, onBack }) => {
             </h3>
 
             <div className="mx_DevTools_SettingsExplorer_warning">
-                <b>{_t("devtools|caution_colon")}</b> {_t("devtools|use_at_own_risk")}
+                <strong>{_t("devtools|caution_colon")}</strong> {_t("devtools|use_at_own_risk")}
             </div>
 
             <div>

src/components/views/dialogs/security/RestoreKeyBackupDialog.tsx

@@ -405,7 +405,9 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
             title = _t("restore_key_backup_dialog|enter_phrase_title");
             content = (
                 <div>
-                    <p>{_t("restore_key_backup_dialog|key_backup_warning", {}, { b: (sub) => <b>{sub}</b> })}</p>
+                    <p>
+                        {_t("restore_key_backup_dialog|key_backup_warning", {}, { b: (sub) => <strong>{sub}</strong> })}
+                    </p>
                     <p>{_t("restore_key_backup_dialog|enter_phrase_description")}</p>
 
                     <form className="mx_RestoreKeyBackupDialog_primaryContainer">
@@ -467,7 +469,9 @@ export default class RestoreKeyBackupDialog extends React.PureComponent<IProps,
 
             content = (
                 <div>
-                    <p>{_t("restore_key_backup_dialog|key_backup_warning", {}, { b: (sub) => <b>{sub}</b> })}</p>
+                    <p>
+                        {_t("restore_key_backup_dialog|key_backup_warning", {}, { b: (sub) => <strong>{sub}</strong> })}
+                    </p>
                     <p>{_t("restore_key_backup_dialog|enter_key_description")}</p>
 
                     <div className="mx_RestoreKeyBackupDialog_primaryContainer">

src/components/views/rooms/NewRoomIntro.tsx

@@ -97,7 +97,7 @@ const NewRoomIntro: React.FC = () => {
                         introMessage,
                         {},
                         {
-                            displayName: () => <b>{displayName}</b>,
+                            displayName: () => <strong>{displayName}</strong>,
                         },
                     )}
                 </p>
@@ -241,7 +241,7 @@ const NewRoomIntro: React.FC = () => {
                         "room|intro|start_of_room",
                         {},
                         {
-                            roomName: () => <b>{room.name}</b>,
+                            roomName: () => <strong>{room.name}</strong>,
                         },
                     )}
                 </p>

src/components/views/rooms/RoomPreviewCard.tsx

@@ -95,7 +95,7 @@ const RoomPreviewCard: FC<IProps> = ({ room, onJoinButtonClicked, onRejectButton
                                 "room|invites_you_text",
                                 {},
                                 {
-                                    inviter: () => <b>{inviter?.name || inviteSender}</b>,
+                                    inviter: () => <strong>{inviter?.name || inviteSender}</strong>,
                                 },
                             )}
                         </div>

src/components/views/rooms/RoomSearchAuxPanel.tsx

@@ -38,7 +38,7 @@ const RoomSearchAuxPanel: React.FC<Props> = ({ searchInfo, isRoomEncrypted, onSe
                             _t(
                                 "room|search|summary",
                                 { count: searchInfo.count },
-                                { query: () => <b>{searchInfo.term}</b> },
+                                { query: () => <strong>{searchInfo.term}</strong> },
                             )
                         ) : (
                             <InlineSpinner />

src/components/views/rooms/RoomUpgradeWarningBar.tsx

@@ -69,7 +69,7 @@ export default class RoomUpgradeWarningBar extends React.PureComponent<IProps, I
                             "room_settings|advanced|room_upgrade_warning",
                             {},
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                                 i: (sub) => <i>{sub}</i>,
                             },
                         )}

src/components/views/settings/CryptographyPanel.tsx

@@ -108,7 +108,7 @@ export default class CryptographyPanel extends React.Component<IProps, IState> {
                                 <th scope="row">{_t("settings|security|session_key")}</th>
                                 <td>
                                     <code>
-                                        <b>{identityKey}</b>
+                                        <strong>{identityKey}</strong>
                                     </code>
                                 </td>
                             </tr>

src/components/views/settings/JoinRuleSettings.tsx

@@ -281,7 +281,7 @@ const JoinRuleSettings: React.FC<JoinRuleSettingsProps> = ({
                 "room_settings|security|join_rule_restricted_description_active_space",
                 {},
                 {
-                    spaceName: () => <b>{SpaceStore.instance.activeSpaceRoom!.name}</b>,
+                    spaceName: () => <strong>{SpaceStore.instance.activeSpaceRoom!.name}</strong>,
                 },
             );
         } else {
@@ -349,7 +349,7 @@ const JoinRuleSettings: React.FC<JoinRuleSettingsProps> = ({
                     (roomId) => !cli.getRoom(roomId)?.currentState.maySendStateEvent(EventType.SpaceChild, userId),
                 );
                 if (unableToUpdateSomeParents) {
-                    warning = <b>{_t("room_settings|security|join_rule_restricted_upgrade_warning")}</b>;
+                    warning = <strong>{_t("room_settings|security|join_rule_restricted_upgrade_warning")}</strong>;
                 }
 
                 upgradeRequiredDialog(

src/components/views/settings/SecureBackupPanel.tsx

@@ -259,7 +259,7 @@ export default class SecureBackupPanel extends React.PureComponent<{}, IState> {
                 statusDescription = (
                     <>
                         <SettingsSubsectionText>
-                            {_t("settings|security|key_backup_inactive", {}, { b: (sub) => <b>{sub}</b> })}
+                            {_t("settings|security|key_backup_inactive", {}, { b: (sub) => <strong>{sub}</strong> })}
                         </SettingsSubsectionText>
                         <SettingsSubsectionText>
                             {_t("settings|security|key_backup_connect_prompt")}
@@ -336,7 +336,11 @@ export default class SecureBackupPanel extends React.PureComponent<{}, IState> {
             statusDescription = (
                 <>
                     <SettingsSubsectionText>
-                        {_t("settings|security|key_backup_inactive_warning", {}, { b: (sub) => <b>{sub}</b> })}
+                        {_t(
+                            "settings|security|key_backup_inactive_warning",
+                            {},
+                            { b: (sub) => <strong>{sub}</strong> },
+                        )}
                     </SettingsSubsectionText>
                     <SettingsSubsectionText>{_t("encryption|setup_secure_backup|explainer")}</SettingsSubsectionText>
                 </>

src/components/views/settings/SetIdServer.tsx

@@ -188,8 +188,8 @@ export default class SetIdServer extends React.Component<IProps, IState> {
                             "identity_server|change_prompt",
                             {},
                             {
-                                current: (sub) => <b>{abbreviateUrl(currentClientIdServer)}</b>,
+                                current: (sub) => <strong>{abbreviateUrl(currentClientIdServer)}</strong>,
-                                new: (sub) => <b>{abbreviateUrl(idServer)}</b>,
+                                new: (sub) => <strong>{abbreviateUrl(idServer)}</strong>,
                             },
                         ),
                         button: _t("action|continue"),
@@ -235,7 +235,7 @@ export default class SetIdServer extends React.Component<IProps, IState> {
                 unboundMessage: _t(
                     "identity_server|disconnect_server",
                     {},
-                    { idserver: (sub) => <b>{abbreviateUrl(this.state.currentClientIdServer)}</b> },
+                    { idserver: (sub) => <strong>{abbreviateUrl(this.state.currentClientIdServer)}</strong> },
                 ),
                 button: _t("action|disconnect"),
             });
@@ -278,8 +278,8 @@ export default class SetIdServer extends React.Component<IProps, IState> {
         let message;
         let danger = false;
         const messageElements = {
-            idserver: (sub: string) => <b>{abbreviateUrl(currentClientIdServer)}</b>,
+            idserver: (sub: string) => <strong>{abbreviateUrl(currentClientIdServer)}</strong>,
-            b: (sub: string) => <b>{sub}</b>,
+            b: (sub: string) => <strong>{sub}</strong>,
         };
         if (!currentServerReachable) {
             message = (
@@ -356,13 +356,13 @@ export default class SetIdServer extends React.Component<IProps, IState> {
             bodyText = _t(
                 "identity_server|description_connected",
                 {},
-                { server: (sub) => <b>{abbreviateUrl(idServerUrl)}</b> },
+                { server: (sub) => <strong>{abbreviateUrl(idServerUrl)}</strong> },
             );
             if (this.props.missingTerms) {
                 bodyText = _t(
                     "identity_server|change_server_prompt",
                     {},
-                    { server: (sub) => <b>{abbreviateUrl(idServerUrl)}</b> },
+                    { server: (sub) => <strong>{abbreviateUrl(idServerUrl)}</strong> },
                 );
             }
         } else {

src/components/views/settings/SetIntegrationManager.tsx

@@ -58,7 +58,7 @@ export default class SetIntegrationManager extends React.Component<IProps, IStat
             bodyText = _t(
                 "integration_manager|use_im_default",
                 { serverName: currentManager.name },
-                { b: (sub) => <b>{sub}</b> },
+                { b: (sub) => <strong>{sub}</strong> },
             );
         } else {
             bodyText = _t("integration_manager|use_im");

src/components/views/settings/tabs/room/AdvancedRoomSettingsTab.tsx

@@ -115,7 +115,7 @@ export default class AdvancedRoomSettingsTab extends React.Component<IProps, ISt
                             "room_settings|advanced|room_upgrade_warning",
                             {},
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                                 i: (sub) => <i>{sub}</i>,
                             },
                         )}

src/components/views/settings/tabs/room/SecurityRoomSettingsTab.tsx

@@ -117,7 +117,7 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
                             {_t(
                                 "room_settings|security|enable_encryption_public_room_confirm_description_1",
                                 undefined,
-                                { b: (sub) => <b>{sub}</b> },
+                                { b: (sub) => <strong>{sub}</strong> },
                             )}{" "}
                         </p>
                         <p>
@@ -308,7 +308,7 @@ export default class SecurityRoomSettingsTab extends React.Component<IProps, ISt
                         <p>
                             {" "}
                             {_t("room_settings|security|encrypted_room_public_confirm_description_1", undefined, {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             })}{" "}
                         </p>
                         <p>

src/components/views/settings/tabs/user/HelpUserSettingsTab.tsx

@@ -302,7 +302,7 @@ export default class HelpUserSettingsTab extends React.Component<IProps, IState>
                                 <summary className="mx_HelpUserSettingsTab_accessTokenDetails">
                                     {_t("common|access_token")}
                                 </summary>
-                                <b>{_t("setting|help_about|access_token_detail")}</b>
+                                <strong>{_t("setting|help_about|access_token_detail")}</strong>
                                 <CopyableText getTextToCopy={() => this.context.getAccessToken()}>
                                     {this.context.getAccessToken()}
                                 </CopyableText>

src/components/views/spaces/SpaceSettingsVisibilityTab.tsx

@@ -163,7 +163,9 @@ const SpaceSettingsVisibilityTab: React.FC<IProps> = ({ matrixClient: cli, space
                         <p>
                             {_t("room_settings|visibility|history_visibility_anyone_space_description")}
                             <br />
-                            <b>{_t("room_settings|visibility|history_visibility_anyone_space_recommendation")}</b>
+                            <strong>
+                                {_t("room_settings|visibility|history_visibility_anyone_space_recommendation")}
+                            </strong>
                         </p>
                     </div>
                 </SettingsFieldset>

src/utils/exportUtils/HtmlExport.tsx

@@ -98,7 +98,7 @@ export default class HTMLExporter extends Exporter {
                         exportDate,
                     },
                     {
-                        roomName: () => <b>{safeRoomName}</b>,
+                        roomName: () => <strong>{safeRoomName}</strong>,
                         exporterDetails: () => (
                             <a
                                 href={`https://matrix.to/#/${encodeURIComponent(exporter)}`}
@@ -107,10 +107,10 @@ export default class HTMLExporter extends Exporter {
                             >
                                 {exporterName ? (
                                     <>
-                                        <b>{escapeHtml(exporterName)}</b>I {" (" + safeExporter + ")"}
+                                        <strong>{escapeHtml(exporterName)}</strong>I {" (" + safeExporter + ")"}
                                     </>
                                 ) : (
-                                    <b>{safeExporter}</b>
+                                    <strong>{safeExporter}</strong>
                                 )}
                             </a>
                         ),

src/widgets/CapabilityText.tsx

@@ -154,14 +154,14 @@ export class CapabilityText {
                                 if (room) {
                                     return (
                                         <TextWithTooltip tooltip={room.getCanonicalAlias() ?? roomId}>
-                                            <b>{room.name}</b>
+                                            <strong>{room.name}</strong>
                                         </TextWithTooltip>
                                     );
                                 } else {
                                     return (
-                                        <b>
+                                        <strong>
                                             <code>{roomId}</code>
-                                        </b>
+                                        </strong>
                                     );
                                 }
                             },
@@ -209,7 +209,7 @@ export class CapabilityText {
                                 eventType: eventCap.eventType,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         ),
                         byline: CapabilityText.bylineFor(eventCap),
@@ -222,7 +222,7 @@ export class CapabilityText {
                                 eventType: eventCap.eventType,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         ),
                         byline: CapabilityText.bylineFor(eventCap),
@@ -238,7 +238,7 @@ export class CapabilityText {
                                 eventType: eventCap.eventType,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         ),
                         byline: CapabilityText.bylineFor(eventCap),
@@ -251,7 +251,7 @@ export class CapabilityText {
                                 eventType: eventCap.eventType,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         ),
                         byline: CapabilityText.bylineFor(eventCap),
@@ -266,7 +266,7 @@ export class CapabilityText {
                 "widget|capability|capability",
                 { capability },
                 {
-                    b: (sub) => <b>{sub}</b>,
+                    b: (sub) => <strong>{sub}</strong>,
                 },
             ),
         };
@@ -390,7 +390,7 @@ export class CapabilityText {
                                 msgtype: eventCap.keyStr,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         );
                     } else {
@@ -400,7 +400,7 @@ export class CapabilityText {
                                 msgtype: eventCap.keyStr,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         );
                     }
@@ -412,7 +412,7 @@ export class CapabilityText {
                                 msgtype: eventCap.keyStr,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         );
                     } else {
@@ -422,7 +422,7 @@ export class CapabilityText {
                                 msgtype: eventCap.keyStr,
                             },
                             {
-                                b: (sub) => <b>{sub}</b>,
+                                b: (sub) => <strong>{sub}</strong>,
                             },
                         );
                     }

test/components/structures/__snapshots__/RoomView-test.tsx.snap

@@ -370,9 +370,9 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
                 <p>
                   <span>
                     Send your first message to invite 
-                    <b>
+                    <strong>
                       @user:example.com
-                    </b>
+                    </strong>
                      to chat
                   </span>
                 </p>
@@ -625,9 +625,9 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
                 <p>
                   <span>
                     Send your first message to invite 
-                    <b>
+                    <strong>
                       @user:example.com
-                    </b>
+                    </strong>
                      to chat
                   </span>
                 </p>
@@ -952,9 +952,9 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
                 <p>
                   <span>
                     Send your first message to invite 
-                    <b>
+                    <strong>
                       @user:example.com
-                    </b>
+                    </strong>
                      to chat
                   </span>
                 </p>

test/components/views/auth/__snapshots__/InteractiveAuthEntryComponents-test.tsx.snap

@@ -8,9 +8,9 @@ exports[`<EmailIdentityAuthEntry/> should render 1`] = `
     <p>
       <span>
         To create your account, open the link in the email we just sent to 
-        <b>
+        <strong>
           alice@example.xyz
-        </b>
+        </strong>
         .
       </span>
     </p>

test/components/views/dialogs/__snapshots__/ManageRestrictedJoinRuleDialog-test.tsx.snap

@@ -26,9 +26,9 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
     <p>
       <span>
         Decide which spaces can access this room. If a space is selected, its members can find and join 
-        <b>
+        <strong>
           !roomId:server
-        </b>
+        </strong>
         .
       </span>
     </p>
@@ -176,9 +176,9 @@ exports[`<ManageRestrictedJoinRuleDialog /> should render empty state 1`] = `
     <p>
       <span>
         Decide which spaces can access this room. If a space is selected, its members can find and join 
-        <b>
+        <strong>
           !roomId:server
-        </b>
+        </strong>
         .
       </span>
     </p>

test/components/views/dialogs/__snapshots__/ManualDeviceKeyVerificationDialog-test.tsx.snap

@@ -66,9 +66,9 @@ exports[`ManualDeviceKeyVerificationDialog should display the device 1`] = `
                
               <span>
                 <code>
-                  <b>
+                  <strong>
                     ABCD EFGH
-                  </b>
+                  </strong>
                 </code>
               </span>
             </li>
@@ -181,9 +181,9 @@ exports[`ManualDeviceKeyVerificationDialog should display the device of another
                
               <span>
                 <code>
-                  <b>
+                  <strong>
                     ABCD EFGH
-                  </b>
+                  </strong>
                 </code>
               </span>
             </li>

test/components/views/dialogs/security/__snapshots__/RestoreKeyBackupDialog-test.tsx.snap

@@ -29,9 +29,9 @@ exports[`<RestoreKeyBackupDialog /> should display an error when recovery key is
       <div>
         <p>
           <span>
-            <b>
+            <strong>
               Warning
-            </b>
+            </strong>
             : you should only set up key backup from a trusted computer.
           </span>
         </p>
@@ -129,9 +129,9 @@ exports[`<RestoreKeyBackupDialog /> should not raise an error when recovery is v
       <div>
         <p>
           <span>
-            <b>
+            <strong>
               Warning
-            </b>
+            </strong>
             : you should only set up key backup from a trusted computer.
           </span>
         </p>
@@ -228,9 +228,9 @@ exports[`<RestoreKeyBackupDialog /> should render 1`] = `
       <div>
         <p>
           <span>
-            <b>
+            <strong>
               Warning
-            </b>
+            </strong>
             : you should only set up key backup from a trusted computer.
           </span>
         </p>

test/components/views/settings/CryptographyPanel-test.tsx

@@ -20,7 +20,7 @@ describe("CryptographyPanel", () => {
     it("shows the session ID and key", async () => {
         const sessionId = "ABCDEFGHIJ";
         const sessionKey = "AbCDeFghIJK7L/m4nOPqRSTUVW4xyzaBCDef6gHIJkl";
-        const sessionKeyFormatted = "<b>AbCD eFgh IJK7 L/m4 nOPq RSTU VW4x yzaB CDef 6gHI Jkl</b>";
+        const sessionKeyFormatted = "<strong>AbCD eFgh IJK7 L/m4 nOPq RSTU VW4x yzaB CDef 6gHI Jkl</strong>";
 
         TestUtils.stubClient();
         const client: MatrixClient = MatrixClientPeg.safeGet();
@@ -37,7 +37,7 @@ describe("CryptographyPanel", () => {
         expect(codes[0].innerHTML).toEqual(sessionId);
 
         // Initially a placeholder
-        expect(codes[1].innerHTML).toEqual("<b>...</b>");
+        expect(codes[1].innerHTML).toEqual("<strong>...</strong>");
 
         // Then the actual key
         await flushPromises();
@@ -60,10 +60,10 @@ describe("CryptographyPanel", () => {
         const codes = rendered.container.querySelectorAll("code");
 
         // Initially a placeholder
-        expect(codes[1].innerHTML).toEqual("<b>...</b>");
+        expect(codes[1].innerHTML).toEqual("<strong>...</strong>");
 
         // Then "not supported key
         await flushPromises();
-        expect(codes[1].innerHTML).toEqual("<b>&lt;not supported&gt;</b>");
+        expect(codes[1].innerHTML).toEqual("<strong>&lt;not supported&gt;</strong>");
     });
 });

test/components/views/settings/__snapshots__/SecureBackupPanel-test.tsx.snap

@@ -79,9 +79,9 @@ exports[`<SecureBackupPanel /> suggests connecting session to key backup when ba
   >
     <span>
       This session is 
-      <b>
+      <strong>
         not backing up your keys
-      </b>
+      </strong>
       , but you do have an existing backup you can restore from and add to going forward.
     </span>
   </div>

test/components/views/settings/__snapshots__/SetIntegrationManager-test.tsx.snap

@@ -41,9 +41,9 @@ exports[`SetIntegrationManager should render manage integrations sections 1`] =
   >
     <span>
       Use an integration manager 
-      <b>
+      <strong>
         (scalar.vector.im)
-      </b>
+      </strong>
        to manage bots, widgets, and sticker packs.
     </span>
   </div>

test/components/views/settings/devices/__snapshots__/LoginWithQRFlow-test.tsx.snap

@@ -1067,9 +1067,9 @@ exports[`<LoginWithQRFlow /> renders QR code 1`] = `
         <li>
           <span>
             Select "
-            <b>
+            <strong>
               Sign in with QR code
-            </b>
+            </strong>
             "
           </span>
         </li>

test/components/views/settings/tabs/room/__snapshots__/SecurityRoomSettingsTab-test.tsx.snap

@@ -178,9 +178,9 @@ exports[`<SecurityRoomSettingsTab /> join rule warns when trying to make an encr
       <p>
          
         <span>
-          <b>
+          <strong>
             It's not recommended to make encrypted rooms public.
-          </b>
+          </strong>
            It will mean anyone can find and join the room, so anyone can read messages. You'll get none of the benefits of encryption. Encrypting messages in a public room will make receiving and sending messages slower.
         </span>
          

test/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap

@@ -48,9 +48,9 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
         >
           <span>
             Use an integration manager 
-            <b>
+            <strong>
               (scalar.vector.im)
-            </b>
+            </strong>
              to manage bots, widgets, and sticker packs.
           </span>
         </div>
@@ -333,9 +333,9 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
                       </th>
                       <td>
                         <code>
-                          <b>
+                          <strong>
                             ...
-                          </b>
+                          </strong>
                         </code>
                       </td>
                     </tr>

test/components/views/spaces/__snapshots__/SpaceSettingsVisibilityTab-test.tsx.snap

@@ -143,9 +143,9 @@ exports[`<SpaceSettingsVisibilityTab /> renders container 1`] = `
                 <p>
                   Allow people to preview your space before they join.
                   <br />
-                  <b>
+                  <strong>
                     Recommended for public spaces.
-                  </b>
+                  </strong>
                 </p>
               </div>
             </div>

test/utils/exportUtils/__snapshots__/HTMLExport-test.ts.snap

@@ -58,7 +58,7 @@ exports[`HTMLExport should export 1`] = `
                                     <div class="mx_NewRoomIntro">
                                             <span role="presentation" title="!myroom:example.org" data-testid="avatar-img" data-type="round" data-color="1" class="_avatar_mcap2_17 mx_BaseAvatar _avatar-imageless_mcap2_61" style="--cpd-avatar-size:32px">!</span>
                                             <h2> !myroom:example.org </h2>
-                                            <p>  created this room. <br/><br/> <p><span>This is the start of export of <b>!myroom:example.org</b>. Exported by <a href="https://matrix.to/#/%40userId%3Amatrix.org" target="_blank" rel="noopener noreferrer"><b>@userId:matrix.org</b></a> at 11/17/2022.</span></p> </p>
+                                            <p>  created this room. <br/><br/> <p><span>This is the start of export of <strong>!myroom:example.org</strong>. Exported by <a href="https://matrix.to/#/%40userId%3Amatrix.org" target="_blank" rel="noopener noreferrer"><strong>@userId:matrix.org</strong></a> at 11/17/2022.</span></p> </p>
                                             <br/>
                                             <p>  </p>
                                         </div>