phetsims / masses-and-springs-basics

"Masses and Springs: Basics" is an educational simulation in HTML5, by PhET Interactive Simulations.
GNU General Public License v3.0
0 stars 3 forks source link

Short Strings are centered #59

Closed KatieWoe closed 5 years ago

KatieWoe commented 5 years ago

For https://github.com/phetsims/QA/issues/281 From slack:

Me: centered Are they supposed to be centered like this? I feel like this was an issue too But I can't find it.

Amy Rouinfar [10:26 AM] No, the padding to the left of the checkbox and to the right of the icons should never change Essentially, there would be a big gap between the “x” and the icon. Slack Denzell about this one. I don’t remember this issue, specifically.

Me: I just checked, and this is happening in the published version of MAS.

Denzell Barnett [10:31 AM] I don’t recall a specific issue for this checkbox. Checking… Hmm not finding any specific issues. Could you create a new issue for this stringTest?

arouinfar commented 5 years ago

It looks like the checkbox/icon group is centered in the panel. However, the checkboxes/strings should remain on the left side of the panel, and the icons should remain on the right side of the panel. Making the strings very short should result in a larger gap between the string and icon.

Denz1994 commented 5 years ago

The fix for the checkbox described above should be applied to all checkbox items. This includes VectorVisibilityControlNode and IndicatorVisibilityControlNode for both basics and non-basics versions.

KatieWoe commented 5 years ago

And the Gravity string seems a bit short @arouinfar longer

arouinfar commented 5 years ago

And the Gravity string seems a bit short @arouinfar

Thanks @KatieWoe, since this is a maxWidth issue, and not really related to ?stringTest=x, I've moved https://github.com/phetsims/masses-and-springs-basics/issues/59#issuecomment-467646519 to #63.

Denz1994 commented 5 years ago

Only vectors panel has been updated with some logic to assign a spacing dynamically, based on the content of the panel. Before I apply these changes elsewhere and continue with refactors, could you please review the behavior of this panel with the arrow vectors on master @arouinfar.

Here is what the vector panel looks like with stringTest=x: image

Denz1994 commented 5 years ago

Note any fix for the original panel described in https://github.com/phetsims/masses-and-springs-basics/issues/59#issue-409418640 should be applied to the vector panel as well, so it is safe to review both.

arouinfar commented 5 years ago

@Denz1994 the vector panel has the desired alignment with ?stringTest=x. Ideally, the reference line checkboxes would be left aligned with the vector checkboxes, and the reference line icons would be right-aligned with the vector icons.

Currently, the reference line checkboxes are still centered in master.

Denz1994 commented 5 years ago

the vector panel has the desired alignment with ?stringTest=x

Nice. Similar behavior for a dynamic maxWidth was applied to all other checkboxes and radio buttons with a complimentary icon. Could you review master @arouinfar and assign back to me?

arouinfar commented 5 years ago

Looks good in MAS and MASB! Thanks @Denz1994.

Denz1994 commented 5 years ago

The relevant commits need to be cherry-picked into the RC branch for MASB before the next RC test.

Denz1994 commented 5 years ago

Relevant commits have been cherry-picked into MAS masses-and-springs-basics-1.0 branch and MASB 1.0 branch. This is now ready for verification in the next RC test.

KatieWoe commented 5 years ago

Looks good in both versions. MASB 1.0.0-rc.3