Fix the progress graph y-axis - window resize formatting problem in Ironwood

Description

Description
---------------

There's an issue that when the screen size is changed after the progress bar is rendered the y-axis values move and overlap the graph or end up off the screen.

The issue here is that the graph is drawn using d3 and d3 fixes nodes to a specific x and y value. The y-axis values are fixed using the left css attribute. When the screen changes the left value keeps the same and it ends up being somewhere different.

The fix is to make the parent div to have a fixed width which is going to be the width of the screen (or really wherever it's rendered, could be another div) and that width will not change if the screen size is changed.

*Sandbox URL*: TBD - sandbox is being provisioned.

Testing
---------

1. Resize the browser window so it's narrow.
2. Navigate to the Progress tab.
3. Resize the window so it's wide, making sure the y-axis is in the correct place.

Reviewers
--------------

  • [ ] (OpenCraft internal reviewer's GitHub username goes here)

  • [ ] edX reviewer[s] TBD

Status

Assignee

Unassigned

Reporter

Open Source Pull Request Bot

Labels

Contributor Name

Paulo Viadanna

Repo

edx/edx-platform

Customer

Epic Link

None

OSCM Assignee

None

Priority

Unset
Configure