Update findex sankey

Description

This MR update the findex threat sankey, per changes requested by the SMEs in our latest regroup meeting.

Changes Made

• Switch order of colors to align with manuscript, per changes made in !89 (merged)
• Update Exploitation -> fishing pressure, per changes made in !89 (merged)
• Add subtitle to each side of chart that indicates that the chart elements on each side are ranked
• Fix wrapping code, per bugs addressed in !79 (merged)
• Drop custom sorting code in favor of package option
• Add a thumbnail for the sankey chart

laptop-sized screen:

mobile simulation:

thumbnail on card:

How to Test

Pull the changes locally, run npm run dev and navigate to visualizations/earth-in-flux/#/findex/inland-fish-total-threats

Make sure the colors are accurate. Let me know whether or not you think the subtitle is clear

MR t-shirt size

• extra-small (e.g., update color scheme)
• small (e.g., add tooltip to chart)
• medium (e.g., add new static chart, add new pipeline output)
• large (e.g., initial data processing pipeline, interactive chart)

Timeline for review

• ASAP - blocker for deployment
• Today - blocker for ongoing work
• Next couple of days
• This week
• When reviewer has availability

Review Needs

Does this MR include data processing, modeling, or visualization code that will require domain review prior to release?

• Yes, and I have opened an issue to document the need for review, using the DomainReview issue template
• Yes, and a domain review issue already exists
• No

Related Issues

Updates colors in chart for which domain review will be required - #50

Additional Notes

Note - I am aware you can't review this until you have node set up locally.

Merge Request Checklists

• Code changes adhere to best practices documented in README.md
• Code has been cleaned the way Vue likes it - run npm run lint --fix
• If applicable, the need for future domain review has been documented in an issue
• Below section documents which browsers the site has been tested on:
  • Desktop/laptop
    • Chrome
    • Safari
    • Edge
    • Firefox
  • Mobile device
    • Chrome
    • Safari
    • Edge
    • Firefox

requested review from @kvaarre-lamoureux

marked the checklist item Code has been cleaned the way Vue likes it - run npm run lint --fix as completed

marked the checklist item Chrome as completed

marked the checklist item Firefox as completed

Colors look good, I think the subtitles are clear, looks good in other aspect ratios (mobile and tablet). I think this is good to go!

approved this merge request

mentioned in commit 2724101f

merged