diff options
Diffstat (limited to 'app/javascript')
-rw-r--r-- | app/javascript/flavours/glitch/components/poll.js | 19 | ||||
-rw-r--r-- | app/javascript/flavours/glitch/styles/polls.scss | 6 |
2 files changed, 17 insertions, 8 deletions
diff --git a/app/javascript/flavours/glitch/components/poll.js b/app/javascript/flavours/glitch/components/poll.js index c18ee1505..45ce107aa 100644 --- a/app/javascript/flavours/glitch/components/poll.js +++ b/app/javascript/flavours/glitch/components/poll.js @@ -60,7 +60,11 @@ class Poll extends ImmutablePureComponent { if (this.props.poll.get('multiple')) { const tmp = { ...this.state.selected }; - tmp[value] = true; + if (tmp[value]) { + delete tmp[value]; + } else { + tmp[value] = true; + } this.setState({ selected: tmp }); } else { const tmp = {}; @@ -86,11 +90,11 @@ class Poll extends ImmutablePureComponent { }; renderOption (option, optionIndex) { - const { poll } = this.props; - const percent = (option.get('votes_count') / poll.get('votes_count')) * 100; - const leading = poll.get('options').filterNot(other => other.get('title') === option.get('title')).every(other => option.get('votes_count') > other.get('votes_count')); - const active = !!this.state.selected[`${optionIndex}`]; - const showResults = poll.get('voted') || poll.get('expired'); + const { poll, disabled } = this.props; + const percent = (option.get('votes_count') / poll.get('votes_count')) * 100; + const leading = poll.get('options').filterNot(other => other.get('title') === option.get('title')).every(other => option.get('votes_count') > other.get('votes_count')); + const active = !!this.state.selected[`${optionIndex}`]; + const showResults = poll.get('voted') || poll.get('expired'); return ( <li key={option.get('title')}> @@ -109,9 +113,10 @@ class Poll extends ImmutablePureComponent { value={optionIndex} checked={active} onChange={this.handleOptionChange} + disabled={disabled} /> - {!showResults && <span className={classNames('poll__input', { active })} />} + {!showResults && <span className={classNames('poll__input', { checkbox: poll.get('multiple'), active })} />} {showResults && <span className='poll__number'>{Math.floor(percent)}%</span>} {option.get('title')} diff --git a/app/javascript/flavours/glitch/styles/polls.scss b/app/javascript/flavours/glitch/styles/polls.scss index b93d36e92..f42496559 100644 --- a/app/javascript/flavours/glitch/styles/polls.scss +++ b/app/javascript/flavours/glitch/styles/polls.scss @@ -47,9 +47,13 @@ height: 18px; margin-right: 10px; top: -1px; - border-radius: 4px; + border-radius: 50%; vertical-align: middle; + &.checkbox { + border-radius: 4px; + } + &.active { border-color: $valid-value-color; background: $valid-value-color; |