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 904e884771..da2d377677 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 ( -
-
- +
+
+
{intl.formatMessage(option.shortText)} diff --git a/app/javascript/styles/components.scss b/app/javascript/styles/components.scss index 93fcb4e231..ddf214ed2e 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;