Fix spacing regression in user settings - roles & permissions (#10993)

* add content container to settingsfieldset

* fix spacing
This commit is contained in:
Kerry 2023-05-29 10:20:44 +12:00 committed by GitHub
parent 9080f3dd55
commit 520659242b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 221 additions and 190 deletions

View file

@ -57,7 +57,6 @@ limitations under the License.
.mx_JoinRuleSettings_radioButton {
padding-top: 16px;
margin-bottom: 8px;
.mx_StyledRadioButton_content {
margin-left: 14px;

View file

@ -34,6 +34,8 @@ limitations under the License.
}
.mx_ProfileSettings_profile_controls_topic {
margin-top: $spacing-8;
& > textarea {
font-family: inherit;
resize: vertical;

View file

@ -43,3 +43,9 @@ limitations under the License.
}
}
}
.mx_SettingsFieldset_content {
display: flex;
flex-direction: column;
gap: $spacing-8;
}

View file

@ -31,7 +31,7 @@ const SettingsFieldset: React.FC<Props> = ({ legend, className, children, descri
<SettingsSubsectionText>{description}</SettingsSubsectionText>
</div>
)}
{children}
<div className="mx_SettingsFieldset_content">{children}</div>
</fieldset>
);

View file

@ -466,7 +466,7 @@ export default class RolesRoomSettingsTab extends React.Component<IProps> {
label = _t("Send %(eventType)s events", { eventType });
}
return (
<div className="" key={eventType}>
<div key={eventType}>
<PowerSelector
label={label}
value={eventsLevels[eventType]}

View file

@ -20,9 +20,13 @@ exports[`<SettingsFieldset /> renders fieldset with plain text description 1`] =
Changes to who can read history.
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<div>
test
</div>
</div>
</fieldset>
</DocumentFragment>
`;
@ -54,9 +58,13 @@ exports[`<SettingsFieldset /> renders fieldset with react description 1`] = `
</a>
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<div>
test
</div>
</div>
</fieldset>
</DocumentFragment>
`;
@ -72,9 +80,13 @@ exports[`<SettingsFieldset /> renders fieldset without description 1`] = `
>
Who can read history?
</legend>
<div
class="mx_SettingsFieldset_content"
>
<div>
test
</div>
</div>
</fieldset>
</DocumentFragment>
`;

View file

@ -9,6 +9,9 @@ exports[`RolesRoomSettingsTab Banned users renders banned users 1`] = `
>
Banned users
</legend>
<div
class="mx_SettingsFieldset_content"
>
<ul
class="mx_RolesRoomSettingsTab_bannedList"
>
@ -24,5 +27,6 @@ exports[`RolesRoomSettingsTab Banned users renders banned users 1`] = `
</span>
</li>
</ul>
</div>
</fieldset>
`;

View file

@ -18,6 +18,9 @@ exports[`<SecurityRoomSettingsTab /> history visibility uses shared as default h
Changes to who can read history will only apply to future messages in this room. The visibility of existing history will be unchanged.
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<label
class="mx_StyledRadioButton mx_StyledRadioButton_enabled"
>
@ -103,6 +106,7 @@ exports[`<SecurityRoomSettingsTab /> history visibility uses shared as default h
class="mx_StyledRadioButton_spacer"
/>
</label>
</div>
</fieldset>
`;

View file

@ -52,6 +52,9 @@ exports[`<SpaceSettingsVisibilityTab /> renders container 1`] = `
Decide who can view and join mock-space.
</div>
</div>
<div
class="mx_SettingsFieldset_content"
>
<label
class="mx_StyledRadioButton mx_JoinRuleSettings_radioButton mx_StyledRadioButton_disabled mx_StyledRadioButton_checked"
>
@ -145,6 +148,7 @@ exports[`<SpaceSettingsVisibilityTab /> renders container 1`] = `
</b>
</p>
</div>
</div>
</fieldset>
</div>
</div>