Button with Checkmark should be hidden to users who can't unmark correct answers

Hi Discourse-solved team,

Suggesting UX changes, button with Checkmark should be hidden to users who can’t unmark correct answers.

02%20AM

The word SOLUTION should be the only one visible.

Thanks.

1 Like

I disagree - I think the filled box is an important part of the styling highlighting the post.

13 Likes

@riking

Having a checkbox tells users that I can uncheck it. If I am not the OP or admin, I shouldn’t see the checkbox. Only OP or admin should see checkbox because that action is only for them.

For everyone else, they should only see the word “SOLUTION”.

We can add additional highlights by making the background of the post ‘Green’ or have additional highlights around it. But not using the checkbox.

UX wise, having a checkbox for the readers is not the proper way.

To the discourse-solved developers, i’m not a ruby dev, but how can i modify this in code in case I want to remove the checkbox in my site for readers not OP/Admin? What part of the code handles this?

Thank you. :slight_smile:

1 Like

You can hide it by adding the following line of CSS to your theme:

.actions button.accepted {display:none;}

PS: this does show there’s a slight alignment issue with the ‘Solution’ text:

image

4 Likes

Thanks @bartv for the suggestion.

But the problem with that solution is it also hides the checkmark to OP or admin who should have the ability to uncheck it.

Ah true. Perhaps you could dig into the CSS a bit more to make the selector more specific and avoid this.

I was trying to do that and realize that this isn’t possible because you can’t add any conditions (if/else) in the CSS. The only way to make it work is editing it directly thru the plugin code.

To everyone that helped, thanks.

I was able to modify the plugin code already:

Here’s what I did:

For OP:
Instead of just the checkmark, I added this button - “This solved my question” which is more visible to the OP or readers.
24%20AM

Also, if OP wants to change his/her answer, this is what he/she sees:

42%20AM

Now, if I am not OP or admin. Here is what I see:

57%20AM

Again, thanks for those who have created this plugin. :slight_smile:

8 Likes

I actually like this change quite a bit @sam – makes it much clearer, if you want to prioritize solved in a category.

3 Likes

Maybe @awesomerobot can do some mockups here, I am fine to make solved clearer. I agree that marking something as a solution is not super clear to the OP.

5 Likes

Having "this solved my question below a series of short replies is going to get very noisy very quickly though.

Really need to show mockups of how a topic will look, rather than individual posts.

6 Likes

It’s noisy, but just for OP, so I don’t think it’s so bad. It’s worth a little noise if increases feature use.

I shortened the copy from “this solved my question” to “mark as solution,” the longer version is clearer, but it’s also… long. Using “mark” also gives us “unmark” as the reverse.

Also Font Awesome’s times-square (:negative_squared_cross_mark:) icon is premium-only, and the times-circle is free, so that’s why I’m using circles here.

Mobile’s a little tricky, maybe we show “solution” and then if they expand the controls we hide the text and just show the icon?

6 Likes

Interesting yeah maybe in mobile we suppress text till clicked … on that note, how would “unmarking” the solution work in mobile?

2 Likes

Yeah it’s difficult to keep the same amount of clarity on mobile, the post controls are already crammed. One option could be to move the controls for solved outside of the existing topic nav

5 Likes

How about emphasizing the mark as solution for the current reply only and shift the emphasis as the reader scrolls? Appreciate it’s much more involved but would reduce noise considerably.

2 Likes

It was implemented in:

https://github.com/discourse/discourse-solved/pull/78

This is how it looks on desktop:

Can accept / unaccept:


Cannot accept / unaccept:


The same, but for mobile:


7 Likes

My first impression is that this made it very noisy.

The fact that the label is so long “Mark as solution” and it is closer to the like button than to the checkmark (by 2 pixels :stuck_out_tongue: ) doesn’t help too.

4 Likes

I feel like this demonstrates my earlier concern pretty well.

2 Likes

What if we leverage the Wiki design to keep it following a pattern?

Normal Post:
image

Wiki:
image

Solution:
image

5 Likes

I think it is worth revisiting the idea of changing iconography with this big change. The circles look somewhat less prominent in the list. I know that there is an aspect of “cheese move” resistance movement here. But I would like to keep square if possible with the change even if we have to re-draw 1-2 SVGs.

We attempted the merge on Friday but I rolled it back cause we had an oversight and applied the styling changes to non OP this was meant to be a change that was extremely tightly scoped to OP only (not staff for example).

Another concern I have for OP is the “continuous” invitation to “unmark as solution” once you marked something as a solution I find that is somewhat cluttery, is there anything we can do here? To “unheart” you simply click the heart again, why don’t we follow the same pattern?

4 Likes