[Mobile] UI Updates on Leaderboard (S.1.11)

[drewjhart]

Issue:

UI updates to more closely match Figma

Resolution:

Update relevant screen per comments on https://www.figma.com/file/PadzU8GqyhFLCjIt7rQkpE/RightOn-Apps?node-id=11957%3A373842&t=SGeD0ipYgjvbSbpc-0

[josephinaim]

Hey Drew, not sure if I'm missing something but I can't tell the difference between the current screen and the figma screen? It seems the same.

[sincwu]

Hey Josephina, A few small differences include the following:

1. Instead of displaying first and last name, just display first name and last initial
2. If the first name and last initial do not fit in one line, make sure the score is middle aligned vertically (rather than top aligned)
3. Please make sure the font size of the score matches what is shown in Figma
4. When multiple students are tied for the same score, display those names in alphabetical order (sorting first by first name, then by last initial -- e.g., Taylor A. would appear before Taylor B., etc.)

[josephinaim]

Thank you for clarifying!

[drewjhart]

In addition to the comments from Sinclair above, I've added a very minor comment about a gradient behind the text.

[drewjhart]

@josephinaim

[josephinaim]

The most current pr has displaying first and last name, just display first name and last initial. I wasn't able to get around to the other bullet points, unfortunately.