Fix ScoreBox UI

[amjiao]

Overview

Address issue #44

Changes Made

Rounded corners and included border

Test Coverage

Checked visually, matches Figma

[zachseidner1]

Thank you for working on this Amy. I think there are some code quality improvements you could make for the UI. Additionally, the main thing this was supposed to fix is how long scores appear, which your change does not address. See how the preview I added displays differently than the Figma? I think you'll need a minimum width on the text, and also account for text overflow and use ellipses

[amjiao]

• Edited GameDetailsScreen lines because the ScoreBox covers the case where the score breakdown is empty (with the placeholder hyphens) and ScoreBox should always display if current time is past the game start time.
• Didn't implement the team icon instead of team name change because I think I'd have to mess around with data classes and I should prob focus on finishing other issues first

[zachseidner1]

This is just barely ready for MVP but there are still some issues that I'd like you to resolve.

We're missing the drop shadow around the score box. The border gets cut off at the corner. Also, the school names should have a min width of 60 as specified by the design. Also, the numbers for the periods are not center aligned with their scores.

Just merge it for now, and I'll create a GitHub issue so we can follow up later.