openclimatefix / quartz-frontend

Front End repo for the Nowcasting project.
https://openclimatefix.org/projects/nowcasting/
MIT License
103 stars 16 forks source link

improve Data tooltip in profile dropdown menu #321

Closed rachel-labri-tipton closed 5 months ago

rachel-labri-tipton commented 1 year ago

In the profile dropdown menu, the tooltip explaining the data for the nowcasting app covers the entire dropdown menu. Elisabeth, our designer, made a couple suggestions about this on the delta view mvp deployed Vercel branch, so I'm putting them here.

Detailed Description

On the 'Data' option, can we change the overlay to not cover the dropdown? Or change the label to "Data source" and on click show a little modal with an option to close it.

It currently looks something like this:

Screenshot 2023-02-01 at 10 52 26

The suggested designs can be found here on Figma.

The dropdown menu should contain less information about the app:

Screenshot 2023-04-03 at 15 54 23

And there is a Settings popup design:

Screenshot 2023-04-03 at 16 02 06

An About tab with some of the information currently in the profile dropdown:

Screenshot 2023-04-03 at 15 57 03

There should be a tab for Data:

Screenshot 2023-04-03 at 15 58 17

For the moment, let's hold off on the Export CSV section of this dropdown menu.

There should also be a corresponding popup for Data:

Screenshot 2023-04-03 at 15 59 18

Context

This will make it easier for a user to get the information about the data and still be able to easily use the profile dropdown menu. Elisabeth should be able to provide a design to help improve the data tooltip.

Possible Implementation

Follow the design for a new tooltip.