diff --git a/res/css/views/settings/_Notifications.scss b/res/css/views/settings/_Notifications.scss index a0e46c0071..571d8141ec 100644 --- a/res/css/views/settings/_Notifications.scss +++ b/res/css/views/settings/_Notifications.scss @@ -90,3 +90,7 @@ limitations under the License. margin-top: 35px; // lots of distance from the last line of the table } } + +.mx_AccessibleButton.mx_NotificationSound_browse { + margin-right: 10px; +} diff --git a/src/components/views/settings/tabs/room/NotificationSettingsTab.tsx b/src/components/views/settings/tabs/room/NotificationSettingsTab.tsx index 32453b5a25..3060d570a2 100644 --- a/src/components/views/settings/tabs/room/NotificationSettingsTab.tsx +++ b/src/components/views/settings/tabs/room/NotificationSettingsTab.tsx @@ -158,18 +158,22 @@ export default class NotificationsSettingsTab extends React.Component<IProps, IS <div className='mx_SettingsTab_section mx_SettingsTab_subsectionText'> <span className='mx_SettingsTab_subheading'>{ _t("Sounds") }</span> <div> - <span>{ _t("Notification sound") }: <code>{ this.state.currentSound }</code></span><br /> + <div className="mx_SettingsTab_subsectionText"> + <span>{ _t("Notification sound") }: <code>{ this.state.currentSound }</code></span> + </div> <AccessibleButton className="mx_NotificationSound_resetSound" disabled={this.state.currentSound == "default"} onClick={this.clearSound} kind="primary"> { _t("Reset") } </AccessibleButton> </div> <div> <h3>{ _t("Set a new custom sound") }</h3> - <form autoComplete="off" noValidate={true}> - <input ref={this.soundUpload} className="mx_NotificationSound_soundUpload" type="file" onChange={this.onSoundUploadChanged} accept="audio/*" /> - </form> + <div className="mx_SettingsFlag"> + <form autoComplete="off" noValidate={true}> + <input ref={this.soundUpload} className="mx_NotificationSound_soundUpload" type="file" onChange={this.onSoundUploadChanged} accept="audio/*" /> + </form> - { currentUploadedFile } + { currentUploadedFile } + </div> <AccessibleButton className="mx_NotificationSound_browse" onClick={this.triggerUploader} kind="primary"> { _t("Browse") }