Update line-chart interactions

[apburnes]

Summary (required)

• Resolves Line Chart interaction bug #2056
  Fixes interaction and scale placement of line chart.

Impacted areas of the application

This effects the line-chart.js and /data landing page.

[JonellaCulmer]

@apburnes This is excellent! A huge improvement on what we had before. I just have a couple thoughts:

• The table does not function responsively. At different break points the information on the edges disappears, whether it's the Y axis on the left or the figure totals on the right.
• There is nothing linked to the methodology button. And, unfortunately, I'm not sure what was linked there before.

[codecov-io]

Codecov Report

Merging #2276 into develop will decrease coverage by 0.02%.
The diff coverage is 70%.

@@             Coverage Diff             @@
##           develop    #2276      +/-   ##
===========================================
- Coverage    74.37%   74.35%   -0.03%     
===========================================
  Files          111      111              
  Lines         6588     6610      +22     
  Branches       586      589       +3     
===========================================
+ Hits          4900     4915      +15     
- Misses        1688     1695       +7

Impacted Files	Coverage Δ
fec/data/views.py	33.7% <0%> (-0.38%)	⬇️
fec/fec/static/js/modules/helpers.js	57.75% <33.33%> (-0.65%)	⬇️
fec/fec/static/js/modules/line-chart.js	96.37% <86.36%> (-0.84%)	⬇️
fec/fec/static/js/modules/calendar.js	91.36% <0%> (+0.71%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update d1cc4f8...906a570. Read the comment docs.

[JonellaCulmer]

Per our discussion in design sync and a followup convo, we intend to add these line charts back onto the data landing page, as well as incorporate onto the advanced data pages.

Before finalizing/merging this PR:

• Add these pages to advanced data pages
• We need to confirm the updated language for the "Raising breakdown" text (Improve language for advanced data pages #2293) prior to finalizing this ticket.

Mock-ups for the advanced data pages can be found here: #2199

[JonellaCulmer]

@apburnes Here's the updated mock-up for the line charts on the Raising and spending pages:

Raising breakdown button language has changed to More raising charts.
For spending page it will say More spending charts.

Designs:

[JonellaCulmer]

Updates for line charts on advanced data pages and data landing below.

Advanced data pages

• Add additional space between prior section and accordion to help differentiate the separate sections
• border-bottom: 1px solid, line below chart section header
• Update typography to Gandhi for header "Cumulative money raised by committees"
• Update typography to Karla, and text for time toggle: "How much money has been raised between:"
• Move "More raising/spending charts" button above dividing line
• Indent Methodology accordion to align with other accordions on the page
• Eliminate some of the padding between the line chart and Methodology accordion

[JonellaCulmer]

@apburnes Based on our conversation, these are the following changes:

On advanced data pages:

• On both Raising and Spending data pages, remove extra spacing in sections with pink boxes
  

On data landing page:

• Change "Raising breakdown" to "More raising charts"

• Deactivate button to "Who's raising the most" to match other two sections (Where contributions come from and The size of contributions)
  

• Change "Spending breakdown" to "More spending charts"

• Deactivate button to "Who's spending the most" to match other two sections (What's spent on day-to-day activities and Where money is spent to support and oppose candidates)
  

[patphongs]

@JonellaCulmer Do you think we should change the date format on the data landing page for the chart to be the same as on the raising and spending data pages? Right now data landing is formatted Feb 28, 2017, while the raising and spending pages are formatted 02/28/2018.

[JonellaCulmer]

@patphongs Yes, I agree. Thanks for catching. Do you think we need a testing ticket to verify the figures one more time before merge?
@apburnes Can you make that last change? Then I'll approve because everything else looks great!

[patphongs]

Do you think we need a testing ticket to verify the figures one more time before merge?

@JonellaCulmer Yes, it would be good to validate the numbers one more time just to be sure. I've made a testing ticket here and assigned it to @PaulClark2.

#2334

[patphongs]

@apburnes Can you rebase from develop? It looks like there's a conflict

[JonellaCulmer]

This all looks really good. Approved! Thanks for all your efforts on this @apburnes!

[patphongs]

Changes look good to me

[johnnyporkchops]

Works/looks great at all sizes!
It is also useful to now have .content__section--ruled-responsive without min-width for accordions inside tablists.

[johnnyporkchops]

Does this need to be merged to dev for @PaulClark2 to test or should it remain un-merged until after testing?
#2334