Size tooltip

[sajidanower23]

What this PR does

Fixes #2558

Adds a mouse-over tooltip explaining the difference between MB and MiB, KB and KiB, etc.

Checklist

• Unit tests aren't applicable
• I've updated CHANGES.md with what I changed.
• I've linked this PR to an issue in ZenHub (core dev team only)

Screenshot

[t83714]

Tested in gitlab cluster and works well 👍

@alyce Are you happy with the tooltip text? it now reads as:

Note: 1 KiB = 1024 Bytes, 1 MiB = 1024 KiB

Screenshot:

If you want to have a play, here is the test site:

https://2558-size-tooltip.dev.magda.io/dataset/add

[t83714]

@sajidanower23
Had a chat with @alyce

is it possible to make sure the line break is after the comma, e.g.
Note: 1 KiB = 1024 Bytes,
1 MiB = 1024 KiB
or make the tooltip a bit wider so it's all on one line?

At the moment, the 1 MiB was cut off after 1 in tooltip

[sajidanower23]

@t83714 that works fine for me in both Chrome and Firefox. What version of which browser were you using?

[t83714]

@t83714 that works fine for me in both Chrome and Firefox. What version of which browser were you using?

I am using chrome on a Mac. Probably you can wrap that line with a block element to guarantee a new line?

[t83714]

Tested in cluster & worked well~
Well done~ 👍