Update checkbox style to be toggable.

- Add Notifications to be on his own section.
This commit is contained in:
Daniel 2018-07-31 19:42:54 -03:00
parent b31781f6ef
commit 5527df97eb

View file

@ -178,17 +178,6 @@ class SettingsPage extends React.PureComponent<Props, State> {
currentPath={daemonSettings.download_directory} currentPath={daemonSettings.download_directory}
onFileChosen={this.onDownloadDirChange} onFileChosen={this.onDownloadDirChange}
/> />
<br />
<span className="card__subtitle">{__('App Notifications.')}</span>
<FormField
type="checkbox"
name="desktopNotification"
onChange={this.onDesktopNotificationsChange}
checked={desktopNotificationsEnabled}
postfix={__('Desktop Notification')}
/>
</section> </section>
<section className="card card--section"> <section className="card card--section">
<div className="card__title">{__('Max Purchase Price')}</div> <div className="card__title">{__('Max Purchase Price')}</div>
@ -270,6 +259,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
<section className="card card--section"> <section className="card card--section">
<div className="card__title">{__('Content Settings')}</div> <div className="card__title">{__('Content Settings')}</div>
<FormField <FormField
useToggle
type="checkbox" type="checkbox"
name="autoplay" name="autoplay"
onChange={this.onAutoplayChange} onChange={this.onAutoplayChange}
@ -277,6 +267,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
postfix={__('Autoplay media files')} postfix={__('Autoplay media files')}
/> />
<FormField <FormField
useToggle
type="checkbox" type="checkbox"
name="show_nsfw" name="show_nsfw"
onChange={this.onShowNsfwChange} onChange={this.onShowNsfwChange}
@ -287,9 +278,23 @@ class SettingsPage extends React.PureComponent<Props, State> {
)} )}
/> />
</section> </section>
<section className="card card--section">
<div className="card__title">{__('Notifications')}</div>
<FormField
useToggle
type="checkbox"
name="desktopNotification"
onChange={this.onDesktopNotificationsChange}
checked={desktopNotificationsEnabled}
postfix={__('On Download Completion')}
/>
</section>
<section className="card card--section"> <section className="card card--section">
<div className="card__title">{__('Share Diagnostic Data')}</div> <div className="card__title">{__('Share Diagnostic Data')}</div>
<FormField <FormField
useToggle
type="checkbox" type="checkbox"
name="share_usage_data" name="share_usage_data"
onChange={this.onShareDataChange} onChange={this.onShareDataChange}
@ -318,6 +323,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
))} ))}
</FormField> </FormField>
<FormField <FormField
useToggle
type="checkbox" type="checkbox"
name="automatic_dark_mode" name="automatic_dark_mode"
onChange={e => this.onAutomaticDarkModeChange(e.target.checked)} onChange={e => this.onAutomaticDarkModeChange(e.target.checked)}
@ -329,6 +335,7 @@ class SettingsPage extends React.PureComponent<Props, State> {
<section className="card card--section"> <section className="card card--section">
<div className="card__title">{__('Wallet Security')}</div> <div className="card__title">{__('Wallet Security')}</div>
<FormField <FormField
useToggle
type="checkbox" type="checkbox"
name="encrypt_wallet" name="encrypt_wallet"
onChange={e => this.onChangeEncryptWallet(e)} onChange={e => this.onChangeEncryptWallet(e)}