diff options
Diffstat (limited to 'app')
-rw-r--r-- | app/javascript/mastodon/features/compose/components/advanced_options_dropdown.js | 12 | ||||
-rw-r--r-- | app/javascript/styles/components.scss | 2 |
2 files changed, 9 insertions, 5 deletions
diff --git a/app/javascript/mastodon/features/compose/components/advanced_options_dropdown.js b/app/javascript/mastodon/features/compose/components/advanced_options_dropdown.js index 904e88477..da2d37767 100644 --- a/app/javascript/mastodon/features/compose/components/advanced_options_dropdown.js +++ b/app/javascript/mastodon/features/compose/components/advanced_options_dropdown.js @@ -2,6 +2,7 @@ import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import IconButton from '../../../components/icon_button'; +import Toggle from 'react-toggle'; import { injectIntl, defineMessages } from 'react-intl'; const messages = defineMessages({ @@ -55,6 +56,10 @@ export default class AdvancedOptionsDropdown extends React.PureComponent { this.props.onChange(option); } + toggleHandler(option) { + return () => this.props.onChange(option); + } + setRef = (c) => { this.node = c; } @@ -69,10 +74,9 @@ export default class AdvancedOptionsDropdown extends React.PureComponent { const optionElems = options.map((option) => { const active = values.get(option.key) ? 'active' : ''; return ( - <div role='button' className={`advanced-options-dropdown__option ${active}`} - onClick={this.handleClick} data-index={option.key} key={option.key} > - <div className='advanced-options-dropdown__option__icon'> - <IconButton icon={option.icon} title={intl.formatMessage(option.shortText)} /> + <div role='button' className={`advanced-options-dropdown__option`} key={option.key} > + <div className='advanced-options-dropdown__option__toggle'> + <Toggle checked={active} onChange={this.toggleHandler(option.key)} /> </div> <div className='advanced-options-dropdown__option__content'> <strong>{intl.formatMessage(option.shortText)}</strong> diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss index 93fcb4e23..ddf214ed2 100644 --- a/app/javascript/styles/components.scss +++ b/app/javascript/styles/components.scss @@ -2924,7 +2924,7 @@ button.icon-button.active i.fa-retweet { } } -.advanced-options-dropdown__option__icon { +.advanced-options-dropdown__option__toggle { display: flex; align-items: center; justify-content: center; |