Prettify table in tooltip

[yvanrichard]

For sites with multiple measurements, the tooltip now has a table with one row per date.
Unfortunately, it's using the styling of other tables, which doesn't quite work in the tooltip context.

Can we make the table look better? Pretty plain styling I reckon, unless @pepzuijderwijk can come up with a quick design for it?

[pepzuijderwijk]

@yvanrichard Can look into this today. What are these different measurements based on? Could be within same day?
Other approaches: use columns (3) instead of rows, or use toggle to click through multiple measures? Can there be more than 2?

[yvanrichard]

@pepzuijderwijk That'd be good, thanks. The number of columns won't change, but the number of rows does (minimum of two rows). We just need some CSS, something tidier than the screenshot one.

[pepzuijderwijk]

Here are a few options.

1. The table gets quite wide, so it would be good to wrap the labels.
2. Add another column, but this doesn't work for more than 2.
3. Use pagination; to click through the different measurements.

[pepzuijderwijk]

[pepzuijderwijk]

Bottom option is the most economical @yvanrichard

[yvanrichard]

Awesome. First option would be great!
We want to see the different measurements at once.

[pepzuijderwijk]

Will require some delicate spacing of the cols.
For single measurements maybe we should also have the score next to the colour, but just replace 'median' with 'IBI'?

[yvanrichard]

It's important to show that the score is an aggregate.
I should mention that this tooltip changes depending on whether there's one measurement (no table, as it is currently), or multiple (with table).
Also, it changes depending on whether we look at the national or regional level, with the name of the IBI category column changing between "NPS category" (national level) to "Regional IBI category" (regional level), ideally.

[pepzuijderwijk]

Yeah I get that it's an aggregate and that there are different versions of the tooltip depending on content. Just wondering if we can at least have the top bar a bit more similar. Do we need to test design with the different categories, or ok to implement? The designs are in Figma btw.

[yvanrichard]

Ok to implement I reckon. Thanks Pep!

[yvanrichard]

@mike-parkin, it's looking good, thank you. But could you please add the score to the single-visit site next to the coloured circle as well to be consistent?
The text needs to change from "Median score:" to just "Score:" for these cases.