Put room settings form elements in fieldsets (#7311)

* override default fieldset styles

Signed-off-by: Kerry Archibald <kerrya@element.io>

* SettingsFieldset component

Signed-off-by: Kerry Archibald <kerrya@element.io>

* test settings fieldset

Signed-off-by: Kerry Archibald <kerrya@element.io>

* refactor SettingsFlag styles

* use SettingsFieldset in room > securit settings

* use fieldset in urlpreviewsettings

Signed-off-by: Kerry Archibald <kerrya@element.io>

* use SettingsFieldset in AliasSettings

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fieldset in room > roles settings

Signed-off-by: Kerry Archibald <kerrya@element.io>

* css lint

Signed-off-by: Kerry Archibald <kerrya@element.io>

* run i18n

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fussy order

Signed-off-by: Kerry Archibald <kerrya@element.io>

* default export

Signed-off-by: Kerry Archibald <kerrya@element.io>

* fix copyright headers

Signed-off-by: Kerry Archibald <kerrya@element.io>
This commit is contained in:
Kerry 2021-12-09 18:44:22 +01:00 committed by GitHub
parent cba92c0e90
commit 2e3f225520
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 385 additions and 147 deletions

View file

@ -93,16 +93,18 @@ export default class SettingsFlag extends React.Component<IProps, IState> {
} else {
return (
<div className="mx_SettingsFlag">
<span className="mx_SettingsFlag_label">{ label }</span>
<label className="mx_SettingsFlag_label">
<span className="mx_SettingsFlag_labelText">{ label }</span>
{ description && <span className="mx_SettingsFlag_microcopy">
{ description }
</span> }
</label>
<ToggleSwitch
checked={this.state.value}
onChange={this.onChange}
disabled={this.props.disabled || !canChange}
aria-label={label}
/>
{ description && <div className="mx_SettingsFlag_microcopy">
{ description }
</div> }
</div>
);
}