Add icon to mass panel

[arouinfar]

On the Lab screen, it may not be immediately clear which mass the slider is adjusting. After discussion with @ariel-phet we decided that adding an iconic mass to the panel would address this issue. @Denz1994 can you add an iconic adjustable mass to the left of the "Mass" title? Here's a mockup:

[Denz1994]

One cute little mass icon coming up.

[Denz1994]

@arouinfar Can you check this dev version for review?

[arouinfar]

Those are indeed cute little mass icons! 😄

A few tweaks:

• The mass looks a bit too small, can you increase the size ~10%?
• There's also appears to be quite a bit of extra padding at the top of the panel. Can you trim those extra pixels off?
  

[Denz1994]

Panel changes were made on master @arouinfar?

[arouinfar]

@Denz1994 it looks like trimming off the extra padding from the top of the panel shifted the icon down.

Can you center-align the icon with "Mass"?

[Denz1994]

What about now @arouinfar? Try in master.

[arouinfar]

Getting closer @Denz1994, but it's still not quite centered

[Denz1994]

Sorry for the constant commits. Could you try master now @arouinfar?

[arouinfar]

Mass icon looks great!

I've noticed that the "Mass" string looks way smaller than other slider titles. Can you bump it up to 14pt to match the others?

[Denz1994]

The mass string was smaller, due to the size of the panel it is contained in. I made the panel a bit larger so the string also increased in size. What do you think @arouinfar?

[arouinfar]

Sorry to keep kicking this back to you @Denz1994, but the font size still looks pretty small. Can you bump it up a bit more? It's okay if the panel ends up slightly larger.

[Denz1994]

There was a problem with the overall layout of the contentNode of the panel. We needed to remove the force vectors from the mass icon. The icon created bounds to include them despite not being visible. This makes the adjustment of fonts and positioning the panel's content a lot less hacky.

Could you review the massValueControlPanel in master @arouinfar?

[arouinfar]

Getting really close @Denz1994!! Alignment looks good, but the relative font sizes look a bit off. The min/max labels look too large, and the readout looks a bit too small. The min/max/readout should all be the same size, as in the Gravity slider (12 pt, I believe).

[Denz1994]

The max width on the readout was too constraining. It has been made larger and the fonts were not the same size for the min/max labels. Could you check in master @arouinfar?

[arouinfar]

Looking good!