Reactions Changed - FLAG Icon

Horton

This AM I noticed that the reactions icons had changed and the FLAG icon was visable all the time but the other icons were only visable at mouse over. This seems negitive so I disabled FLAGs. Can we go back the other way?

shedoesitall

So odd, it was always that way for me. Curious to hear the response.

Lincoln

Hi @Horton, I didn't make that change personally but I'm inquiring about it.

I'm fairly certain it could be set back to the old behavior with a little custom CSS under "Customize Theme". If you choose to re-enable the Flag button, try adding this to your custom CSS:

.Item .Reactions > .FlagMenu {
   visibility: hidden;
}
.Item:hover .FlagMenu {
   visibility: visible;
}

//edit: Tweaked code above.

Mark

There are a lot of reasons why it was changed to the way that it currently is, but here are some of the main ones:

1. The major piece of feedback from version 1 was that people felt like the page looked cluttered and messy if the reactions were visible all the time. So we changed it so that all reactions were hidden until hover. This resulted in...
2. When everything was hidden and then everything revealed on hover, the spacing looked wrong both when the icons were hidden (too much space) and wrong when they were revealed (not enough space). This compounded the "messy" feel.

The solution we came up with was to look at other sites that do this sort of thing (twitter, disqus, etc) and see how they solved the problem. We found that they all left one item visible all the time (spam button, date of post, something like that) and set up the spacing around that item so that everything looks correct. Then reveal "the rest" of the line of buttons on hover, and everything flows nicely as it is hidden/revealed.

I wasn't the fondest of making it the flag button, but in many ways that button is the most important (we really want users to help identify spam above all else), but the layout worked so well we decided to go with it.

I highly recommend that you leave everything as it is, since we will be constantly improving reactions moving forwards, but if you insist on customizing your install, we do give you the power to do so.

I haven't tested these, but theoretically they should work:

If you want to customize your theme so that everything remains visible all the time, put this in your theme customizations:

.Item .Reactions > * { visibility: visible; }

If you want everything to be invisible until hover, put this in your theme customizations:

.Item .Reactions > * {
    visibility: hidden !important;
}
.Item.Open .Reactions > *,
.Item:hover .Reactions > * {
    visibility: visible !important;
}

Horton

I totally understand and agree except that I really do not need the flag very often. I would be happier if it was the Like reaction