SPRINT GOAL - “Refactor d3 dashboard to account for the number of tokens held primarily and earnings, rather than the price.”

https://drive.google.com/open?id=1l29ZTfv9VOWv13Idue5tqJgljh_CRGJ9

• Set each dashboard to hide on load
• Build and center project and token dashboards with three icons as shown and toggles that on click change color to the focus teal color This color switches
• Have text for each view for each dashboard show on hover in teal color in all caps below and above each respective dashboard Show description of dashboard if hover is just on toggle board
• Create on-click functionality that shifts toggle board up or down, and transitions in the view of the dashboard chosen Have it hide and recenter dashboard on re-clicking the same view highlighted

• Will need to seed the database with user tokens held, split between active and non-deployed tokens
• Let’s try to aim to use on-chain data as much as possible, will work with Steven to facilitate this this week.
• Will need to create an expected set of earnings data, ideally linked to specific projects. This data will eventually come from on-chain listeners from project manager wallets for dividend payments.

• Save current price view as it is, and make new token based view a new view to shift to.

• We will keep it as a view to shift to.

• Using a copy of the previous token dashboard, create rects that extend into the sides of both windows
• Unlike in designs have both fill squares match and extend the height of the chart.
• Create overlapping fill rects based on the indicated color that populate the underlying hollow transparent rects based on the tokens or earnings held

• The total tokens held or earnings made should be the height of each rect
• The overlapping rect changes with hover showing the holdings at each point in time.

• Show difference between active and inactive as a transparency difference of two overlapping rects.
• Put in amount of token text that only shows on hover

• Break into two lines, (unlike what is in designs)

• Realign current x axis line calls to reflect new data references, tokens on the right side, earnings on the left.

• Only shows on hover
• Let black main line push back on hover (increase transparency)

• Second line of active tokens also only shows on hover
• Make slightly thicker and the same color as the reference to the side