smogon / damage-calc

Pokemon games damage calculator
https://calc.pokemonshowdown.com
MIT License
396 stars 366 forks source link

Improve appearance of click-to-copy confirmation message #579

Closed DimK19 closed 1 year ago

DimK19 commented 1 year ago

Since originally authoring the pull request that implemented this feature (https://github.com/smogon/damage-calc/pull/441), I have noticed a few ways it could be better.

Firstly, there is an issue when the damage calculation message has a certain length, such that the hidden element that appears on click is pushed to a second line, while no text is there. This results in the abnormality shown in the screenshots below:

Picture1

Picture2

The layout is pushed down by a blank line that accommodates the hidden element.

In order to fix it, I have changed the position of the confirmation message to appear above the text. I have set its position to absolute, so it will not interfere with the rest of the layout.

Below are three screenshots of how it looks, including two extreme cases of a very short output message, and a very long individual move output. Please let me know if there are any other cases I should consider for the position of the message.

Picture3

Picture4

Picture5

Secondly, I reduced the duration of the appearance from 2s to 1.5s, because I found it lingered for too long.

Thanks.

thejetou commented 1 year ago

Thanks!