If we want to keep it as close as possible to the existing UI: F34155362 seems replaceable with a close or trash icon in the color #d33. For the first image in F34155367 we could use expand or the down (indicator) in color #36c. And for the last we have alert in color #fc3.

@Tchanders do you think any of these could be omitted completely? Are there any that aren't doing a good job of communication what they're meant to? I don't know anything about the context, so its hard to judge.

Thanks @Prtksxna

I think they're all playing a communication role within the current design:

• The "Dup" table column either has the icon or not, so it differentiates between votes that have/don't have duplicate cookies
• Clicking on the down arrows causes the page to scroll to the question linked to the error message
• The warning icon appears next to erroneous answers, but not successful ones, so it's useful for distinguishing them

Does that help with close vs trash and expand vs down?

@Tchanders and I met and decided that:

• The Dup row shouldn't have any icon and just have the text 'Duplicate' written in it.
• The down arrow icon should be moved to the end of the sentence. It should be a ButtonWidget with the downTriangle icon and text "See this warning".
• The warning icon should use the OOUI alert icon, in the color #fc3 .

Change 676182 had a related patch set uploaded (by STran; author: STran):

[mediawiki/extensions/SecurePoll@master] Update error icons for vote and vote list pages

https://gerrit.wikimedia.org/r/676182

@Prtksxna a few things came up:

• Both the duplicate and csrf columns use the icon. Should the csrf column also just use text? 'CSRF'?

• Here's what the warning boxes look like. Are they ok? Can make any changes like order/styling/etc.
• Preferential

• RadioRange

(ChooseBallot and ApprovalBallot don't actually implement the error indicator)

In T277277#6963214, @STran wrote:

@Prtksxna a few things came up:

• Both the duplicate and csrf columns use the icon. Should the csrf column also just use text? 'CSRF'?

Yep, that would make sense

• Here's what the warning boxes look like. Are they ok? Can make any changes like order/styling/etc.

This is looking as intended. No changes required.

• Preferential

• RadioRange

(ChooseBallot and ApprovalBallot don't actually implement the error indicator)

These are looking alright too. In F34200710 I can see that the input is shown before the label. Are aware of a reason why it is this way? Is changing it trivial?

In F34200710 I can see that the input is shown before the label. Are aware of a reason why it is this way? Is changing it trivial?

I think it's just how it was originally written. I'm assuming it should ideally be after the label? Not hard at all so I can go ahead and do that.

Just noting that I think we decided in the last team meeting not to change the order of the inputs and labels for now - though correct me if I'm mistaken.

In T277277#6982722, @Tchanders wrote:

Just noting that I think we decided in the last team meeting not to change the order of the inputs and labels for now - though correct me if I'm mistaken.

You're correct. That message was from before standup and the change has already been reverted.

Change 676182 merged by jenkins-bot:

[mediawiki/extensions/SecurePoll@master] Update error icons for vote and vote list pages

https://gerrit.wikimedia.org/r/676182

How the icons on the list page look:
Before:

What the error message on the voting page looks like (for elections of type "Range plurality" and "Range histogram"):
Before:

In theory, the error icons for Approval, Schulze and Plurality type ballots should have changed as well. However, it appears that in practice the validation is done by the browser. I could not find a way to make our icons appear. For example:

Test Environments:

• https://vote.wikimedia.beta.wmflabs.org SecurePoll 2.0.0 (c4f93e2) 06:44, 15 April 2021.
• local docker SecurePoll 2.0.0 (c4f93e2) 06:44, 15 April 2021.

Test Browsers:

• Firefox 78
• IE11