Merge pull request #1226 from hometown-fork/1174-multiple-choice-poll-toggle
Add toggle for multiple choice polls
This commit is contained in:
commit
d271c40341
|
@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
|
||||||
import ImmutablePropTypes from 'react-immutable-proptypes';
|
import ImmutablePropTypes from 'react-immutable-proptypes';
|
||||||
import ImmutablePureComponent from 'react-immutable-pure-component';
|
import ImmutablePureComponent from 'react-immutable-pure-component';
|
||||||
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
|
||||||
|
import Toggle from 'react-toggle';
|
||||||
import IconButton from 'mastodon/components/icon_button';
|
import IconButton from 'mastodon/components/icon_button';
|
||||||
import Icon from 'mastodon/components/icon';
|
import Icon from 'mastodon/components/icon';
|
||||||
import AutosuggestInput from 'mastodon/components/autosuggest_input';
|
import AutosuggestInput from 'mastodon/components/autosuggest_input';
|
||||||
|
@ -155,6 +156,12 @@ class PollForm extends ImmutablePureComponent {
|
||||||
<ul>
|
<ul>
|
||||||
{options.map((title, i) => <Option title={title} key={i} index={i} onChange={onChangeOption} onRemove={onRemoveOption} isPollMultiple={isMultiple} onToggleMultiple={this.handleToggleMultiple} autoFocus={i === autoFocusIndex} {...other} />)}
|
{options.map((title, i) => <Option title={title} key={i} index={i} onChange={onChangeOption} onRemove={onRemoveOption} isPollMultiple={isMultiple} onToggleMultiple={this.handleToggleMultiple} autoFocus={i === autoFocusIndex} {...other} />)}
|
||||||
</ul>
|
</ul>
|
||||||
|
<div className='is-multiple-toggle'>
|
||||||
|
<Toggle className='is-multiple-checkbox' checked={isMultiple} onChange={this.handleToggleMultiple}/>
|
||||||
|
<span className='is-multiple-toggle__label'>
|
||||||
|
<FormattedMessage id='poll.is_multiple' defaultMessage='Multiple choice' />
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div className='poll__footer'>
|
<div className='poll__footer'>
|
||||||
<button disabled={options.size >= 4} className='button button-secondary' onClick={this.handleAddOption}><Icon id='plus' /> <FormattedMessage {...messages.add_option} /></button>
|
<button disabled={options.size >= 4} className='button button-secondary' onClick={this.handleAddOption}><Icon id='plus' /> <FormattedMessage {...messages.add_option} /></button>
|
||||||
|
|
|
@ -374,6 +374,7 @@
|
||||||
"poll.vote": "Vote",
|
"poll.vote": "Vote",
|
||||||
"poll.voted": "You voted for this answer",
|
"poll.voted": "You voted for this answer",
|
||||||
"poll.votes": "{votes, plural, one {# vote} other {# votes}}",
|
"poll.votes": "{votes, plural, one {# vote} other {# votes}}",
|
||||||
|
"poll.is_multiple": "Multiple choice",
|
||||||
"poll_button.add_poll": "Add a poll",
|
"poll_button.add_poll": "Add a poll",
|
||||||
"poll_button.remove_poll": "Remove poll",
|
"poll_button.remove_poll": "Remove poll",
|
||||||
"privacy.change": "Change post privacy",
|
"privacy.change": "Change post privacy",
|
||||||
|
|
|
@ -4116,6 +4116,21 @@ a.status-card.compact:hover {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Hometown: Styling for toggle for multiple choice polls
|
||||||
|
.is-multiple-toggle {
|
||||||
|
display: block;
|
||||||
|
line-height: 24px;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.is-multiple-toggle__label {
|
||||||
|
color: $inverted-text-color;
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: 14px;
|
||||||
|
margin-left: 8px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
.setting-toggle {
|
.setting-toggle {
|
||||||
display: block;
|
display: block;
|
||||||
line-height: 24px;
|
line-height: 24px;
|
||||||
|
|
Loading…
Reference in New Issue