Fix the responsive design of the the gradebook tertiary nav

Set up

This will populate the menu as much as possible.

1. Create a test course and navigate to it
2. Set up at least 1 group with at least 1 participant in that group
3. In the course settings > Groups, set Group mode to "Visible groups"
4. Rename any grade item to have a long title
5. Go to Grades tab > Single View, and select Grade Items. Select the grade item with the long title from the menu
6. Turn on edit mode

Testing

1. Check that the menu items have a max width and the text doesn't overflow that width.
2. Check that the grade item title is shown in full on the page.
3. Gradually resize the window, and check that the following changes happen:
   1. The Actions item and "View By" toggle will drop down together to a second line on the right
   2. The group selector and grade item selector will drop down to new lines as necessary
   3. The vertical bars will disappear and the Actions/"View By" toggle will be left aligned
   4. The label on the "View By" toggle will move above the buttons
   5. Eventually each item will be on a separate line