From 1da6fc8e3c539629e57750c45effa75e60c4095f Mon Sep 17 00:00:00 2001 From: Guo Xiang Tan Date: Wed, 25 Jan 2017 11:56:39 +0800 Subject: [PATCH] UX: Highlight user's vote in polls. --- .../poll/assets/javascripts/widgets/discourse-poll.js.es6 | 5 +++-- plugins/poll/assets/stylesheets/common/poll.scss | 6 +++++- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/plugins/poll/assets/javascripts/widgets/discourse-poll.js.es6 b/plugins/poll/assets/javascripts/widgets/discourse-poll.js.es6 index 843278f7001..60fc833e39c 100644 --- a/plugins/poll/assets/javascripts/widgets/discourse-poll.js.es6 +++ b/plugins/poll/assets/javascripts/widgets/discourse-poll.js.es6 @@ -160,8 +160,9 @@ createWidget('discourse-poll-standard-results', { return ordered.map((option, idx) => { const contents = []; - const per = rounded[idx].toString(); + const chosen = attrs.vote.includes(option.id); + contents.push(h('div.option', h('p', [ h('span.percentage', `${per}%`), optionHtml(option) ]) )); @@ -178,7 +179,7 @@ createWidget('discourse-poll-standard-results', { })); } - return h('li', contents); + return h('li', { className: `${chosen ? 'chosen' : ''}` }, contents); }); } } diff --git a/plugins/poll/assets/stylesheets/common/poll.scss b/plugins/poll/assets/stylesheets/common/poll.scss index 8eba8781a84..d52c6e1429a 100644 --- a/plugins/poll/assets/stylesheets/common/poll.scss +++ b/plugins/poll/assets/stylesheets/common/poll.scss @@ -107,7 +107,11 @@ div.poll { .bar { height: 10px; - background: $primary; + background: dark-light-diff($primary, $secondary, 50%, -25%);; + } + + .chosen .bar { + background: $tertiary; } }