Simplify nodes on ThirdPartyMemberInfo (#10889)

* Remove mx_MemberInfo_profileField

* Merge mx_MemberInfo_profile with mx_MemberInfo_container

* Remove redundant div elements

* Update a Jest snapshot
This commit is contained in:
Suguru Hirahara 2023-05-24 08:28:15 +00:00 committed by GitHub
parent 7248878e7d
commit 0c30f0c838
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 44 deletions

View file

@ -76,6 +76,12 @@ limitations under the License.
.mx_MemberInfo_container {
margin: 0 16px 16px 16px;
&.mx_MemberInfo_container--profile {
margin-bottom: 16px;
font-size: $font-15px;
position: relative;
}
}
.mx_MemberInfo_avatar {
@ -95,23 +101,11 @@ limitations under the License.
}
}
.mx_MemberInfo_profile {
margin-bottom: 16px;
}
.mx_MemberInfo_profileField {
font-size: $font-15px;
position: relative;
}
.mx_MemberInfo_buttons {
margin-bottom: 16px;
}
.mx_MemberInfo_field {
cursor: pointer;
font-size: $font-15px;
color: $primary-content;
margin-left: 8px;
margin-bottom: 16px;
line-height: $font-23px;
}

View file

@ -127,11 +127,9 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
adminTools = (
<div className="mx_MemberInfo_container">
<h3>{_t("Admin Tools")}</h3>
<div className="mx_MemberInfo_buttons">
<AccessibleButton className="mx_MemberInfo_field" onClick={this.onKickClick}>
{_t("Revoke invite")}
</AccessibleButton>
</div>
<AccessibleButton className="mx_MemberInfo_field" onClick={this.onKickClick}>
{_t("Revoke invite")}
</AccessibleButton>
</div>
);
}
@ -154,12 +152,8 @@ export default class ThirdPartyMemberInfo extends React.Component<IProps, IState
<AccessibleButton className="mx_MemberInfo_cancel" onClick={this.onCancel} title={_t("Close")} />
<h2>{this.state.displayName}</h2>
</div>
<div className="mx_MemberInfo_container">
<div className="mx_MemberInfo_profile">
<div className="mx_MemberInfo_profileField">
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
</div>
</div>
<div className="mx_MemberInfo_container mx_MemberInfo_container--profile">
{_t("Invited by %(sender)s", { sender: this.state.senderName })}
</div>
{adminTools}
</div>

View file

@ -20,17 +20,9 @@ exports[`<ThirdPartyMemberInfo /> should render invite 1`] = `
</h2>
</div>
<div
class="mx_MemberInfo_container"
class="mx_MemberInfo_container mx_MemberInfo_container--profile"
>
<div
class="mx_MemberInfo_profile"
>
<div
class="mx_MemberInfo_profileField"
>
Invited by Alice DisplayName
</div>
</div>
Invited by Alice DisplayName
</div>
</div>
</div>
@ -56,17 +48,9 @@ exports[`<ThirdPartyMemberInfo /> should render invite when room in not availabl
</h2>
</div>
<div
class="mx_MemberInfo_container"
class="mx_MemberInfo_container mx_MemberInfo_container--profile"
>
<div
class="mx_MemberInfo_profile"
>
<div
class="mx_MemberInfo_profileField"
>
Invited by Alice DisplayName
</div>
</div>
Invited by Alice DisplayName
</div>
</div>
</div>