Move General user settings styles to more specific places

This was w grab bag of styles for the email/phone components and
one for something now in preferences. Move them elsewhere so I can
rename the tab sensibly.
This commit is contained in:
David Baker 2024-08-01 16:45:56 +01:00
parent 9cd0c247a2
commit 77062ac721
7 changed files with 56 additions and 38 deletions

View file

@ -97,21 +97,21 @@ export class ExistingEmailAddress extends React.Component<IExistingEmailAddressP
public render(): React.ReactNode {
if (this.state.verifyRemove) {
return (
<div className="mx_GeneralUserSettingsTab_section--discovery_existing">
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_promptText">
<div className="mx_EmailAddressesPhoneNumbers_discovery_existing">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_promptText">
{_t("settings|general|remove_email_prompt", { email: this.props.email.address })}
</span>
<AccessibleButton
onClick={this.onActuallyRemove}
kind="danger_sm"
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
>
{_t("action|remove")}
</AccessibleButton>
<AccessibleButton
onClick={this.onDontRemove}
kind="link_sm"
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
>
{_t("action|cancel")}
</AccessibleButton>
@ -120,8 +120,8 @@ export class ExistingEmailAddress extends React.Component<IExistingEmailAddressP
}
return (
<div className="mx_GeneralUserSettingsTab_section--discovery_existing">
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_address">
<div className="mx_EmailAddressesPhoneNumbers_discovery_existing">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_address">
{this.props.email.address}
</span>
<AccessibleButton onClick={this.onRemove} kind="danger_sm" disabled={this.props.disabled}>

View file

@ -93,21 +93,21 @@ export class ExistingPhoneNumber extends React.Component<IExistingPhoneNumberPro
public render(): React.ReactNode {
if (this.state.verifyRemove) {
return (
<div className="mx_GeneralUserSettingsTab_section--discovery_existing">
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_promptText">
<div className="mx_EmailAddressesPhoneNumbers_discovery_existing">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_promptText">
{_t("settings|general|remove_msisdn_prompt", { phone: this.props.msisdn.address })}
</span>
<AccessibleButton
onClick={this.onActuallyRemove}
kind="danger_sm"
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
>
{_t("action|remove")}
</AccessibleButton>
<AccessibleButton
onClick={this.onDontRemove}
kind="link_sm"
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
>
{_t("action|cancel")}
</AccessibleButton>
@ -116,8 +116,8 @@ export class ExistingPhoneNumber extends React.Component<IExistingPhoneNumberPro
}
return (
<div className="mx_GeneralUserSettingsTab_section--discovery_existing">
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_address">
<div className="mx_EmailAddressesPhoneNumbers_discovery_existing">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_address">
+{this.props.msisdn.address}
</span>
<AccessibleButton onClick={this.onRemove} kind="danger_sm" disabled={this.props.disabled}>

View file

@ -178,7 +178,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
<span>
{_t("settings|general|discovery_email_verification_instructions")}
<AccessibleButton
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
kind="primary_sm"
onClick={this.onContinueClick}
disabled={this.state.continueDisabled}
@ -190,7 +190,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
} else if (bound) {
status = (
<AccessibleButton
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
kind="danger_sm"
onClick={this.onRevokeClick}
disabled={this.props.disabled}
@ -201,7 +201,7 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
} else {
status = (
<AccessibleButton
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
kind="primary_sm"
onClick={this.onShareClick}
disabled={this.props.disabled}
@ -212,8 +212,8 @@ export class EmailAddress extends React.Component<IEmailAddressProps, IEmailAddr
}
return (
<div className="mx_GeneralUserSettingsTab_section--discovery_existing">
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_address">{address}</span>
<div className="mx_EmailAddressesPhoneNumbers_discovery_existing">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_address">{address}</span>
{status}
</div>
);

View file

@ -179,7 +179,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
let status;
if (verifying) {
status = (
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_verification">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_verification">
<span>
{_t("settings|general|msisdn_verification_instructions")}
<br />
@ -200,7 +200,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
} else if (bound) {
status = (
<AccessibleButton
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
kind="danger_sm"
onClick={this.onRevokeClick}
disabled={this.props.disabled}
@ -211,7 +211,7 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
} else {
status = (
<AccessibleButton
className="mx_GeneralUserSettingsTab_section--discovery_existing_button"
className="mx_EmailAddressesPhoneNumbers_discovery_existing_button"
kind="primary_sm"
onClick={this.onShareClick}
disabled={this.props.disabled}
@ -222,8 +222,8 @@ export class PhoneNumber extends React.Component<IPhoneNumberProps, IPhoneNumber
}
return (
<div className="mx_GeneralUserSettingsTab_section--discovery_existing">
<span className="mx_GeneralUserSettingsTab_section--discovery_existing_address">+{address}</span>
<div className="mx_EmailAddressesPhoneNumbers_discovery_existing">
<span className="mx_EmailAddressesPhoneNumbers_discovery_existing_address">+{address}</span>
{status}
</div>
);