search

phetsims / fractions-common

Common code for Fractions simulations
MIT License
0 stars 1 forks source link

My Matches too cramped? #100

Closed ghost closed 5 years ago

ghost commented 5 years ago

For https://github.com/phetsims/QA/issues/294.

issue

Seen on Windows 10 + FF.

Looks bad to me.

ghost commented 5 years ago

issue2

amanda-phet commented 5 years ago

Seems related to https://github.com/phetsims/fractions-common/issues/86.

@jonathanolson can you tweak the spacing some more for these extra wide challenges? Maybe the spacing between the equal sign and edges of the container should be the same, so they might be small but at least will be equally small?

jonathanolson commented 5 years ago

Also noticed that we don't have much room when both use the largest representation:

Screen Shot 2019-04-02 at 10 52 47 AM

@ariel-phet or @amanda-phet, should any layout/sizing changes be made to compensate? This doesn't come up much naturally, but it did happen.

jonathanolson commented 5 years ago

Implemented. Also note that this puts the equals sign a bit off-center in common cases, e.g.:

Screen Shot 2019-04-02 at 10 56 45 AM Screen Shot 2019-04-02 at 10 56 58 AM

whereas before it was a bit more centered:

screen shot 2019-02-21 at 11 23 24 am

@amanda-phet and @ariel-phet, does this look good, and/or what should be done about the "difficult to fit" case noted in https://github.com/phetsims/fractions-common/issues/100#issuecomment-479092091?

amanda-phet commented 5 years ago

I don't mind the off-center equal sign since the matches are always listed horizontally.

I am not sure what to do about that really cramped case... My only thought is to make them smaller.

ariel-phet commented 5 years ago

@jonathanolson I am also not bothered by the off center equal sign...

For the cramped case, I think making them smaller is fine. The point of the matches is to see that have you have completed them and have a reasonable idea of what they were. Having them be a bit small is acceptable since the matches are no longer central to the game play.

jonathanolson commented 5 years ago

I can adjust the scale so that it ensures whatever minimum level of padding.

The bare minimum to ensure nothing overlaps looks like:

Screen Shot 2019-04-23 at 9 59 53 AM

But I also noticed that this happens in the bottom zone randomly sometimes:

Screen Shot 2019-04-23 at 9 59 36 AM

So:

  1. Should I bump up the minimum amount of padding in the targets so that there is more space in that type of constrained case?
  2. Should anything be done about the overlap in the bottom?
amanda-phet commented 5 years ago

Should I bump up the minimum amount of padding in the targets so that there is more space in that type of constrained case?

Thanks for finding this. Yes, we should slightly increase the padding. Even when there aren't two diamond shapes next to each other it looks strange. image

jonathanolson commented 5 years ago

Increased padding slightly now, so we have:

Screen Shot 2019-04-23 at 2 06 52 PM Screen Shot 2019-04-23 at 2 06 41 PM

Let me know if it needs further tweaks!

amanda-phet commented 5 years ago

Looks great. Thank you!