Collection box pixel polishing

[arouinfar]

Design meeting 1/30/20

Pixel polishes

• Move strings above the box
• Add padding between boxes
• Larger collection panel
• Bottom-align ResetAllButton with carousel dots

Self-assigning for mockups

[arouinfar]

• Molecule strings match Collection string -- 16 pt bold (Single screen)
• 15 px padding between bottom of the black boxes and the molecule string below it. (Single & Multiple)
• Bottom-align ResetAllButton with carousel dots and right-align with Your Molecules panel (same position on all 3 screens).
  

[Denz1994]

Adjustments have been made as specified above in this comment. Can you review this dev version @arouinfar?

[arouinfar]

@Denz1994 this is definitely a nice improvement. A few more minor things:

• It looks like the ResetAllButton is still bottom-aligned with the carousel body instead of its dots, so things are currently pretty tight on the Single screen.

• On the Multiple screen, the You have: {{#}} string is being obscured a bit by the black box. This is most noticeable when the boxes are empty (bottom of p and y get cut off).
  

[Denz1994]

The above changes have been applied to Master. The bottom of the resetAllButton is aligned with the bottom of the page control buttons (not the top). Also, there was a spacing added to the CollectionBoxNode VBox options so the box's edge doesn't overlap its label text.

Could you review @arouinfar?

[arouinfar]

Looks good @Denz1994, thanks!