XF 2.1 Reaction Panel Wrap

[bluemartian]

I was following a tutorial I saw on here about making my own reactions spritesheet, which worked beautifully. However, I have 16 reactions and the panel when it pops up wraps for the last image, as you can see below. If I disable that last image (question mark), the checkmark image drops down to the 2nd row. If I then disable the checkmark image, the award image drops down to the second row.

Is there a way to get these to display on one row only or to be more symmetrically even on 2 rows? What is the limit for reactions before this wrapping behavior occurs? Or would changing dimensions (they are currently at 32 x 32) help? This is just a minor niggle, but I'd appreciate any suggestions. Thanks!

​

 

[RobinHood]

You can limit the width with css in the extra.less template and shrink it so they all fit on two more equal rows.

I prefer this as you're less likely to accidentally run your cursor out of the box than on a long strip, which will then disappear quickly as there's no delay, which can get annoying.

/* Reactions */
.tooltip.tooltip--reaction {
    max-width: 380px;
}

 

[bluemartian]

Much thanks!

That worked a treat.

I appreciate the info!