Foundation tooltips broken on hover

ebiwd / EBI-Framework

The EMBL-EBI Visual Framework for websites and services.

https://www.ebi.ac.uk/style-lab/websites/

19 stars 16 forks source link

Foundation tooltips broken on hover #145

Open khawkins98 opened 5 years ago

khawkins98 commented 5 years ago

As discovered by @esanzgar , Foundation's tooltips are busted in v1.3 when using the minified CSS.

This appears to be a byproduct of how csso compresses the CSS.

khawkins98 commented 5 years ago

I've tried

-    "csso": "^2.1.1",
+    "csso": "^3.5.1",

But it doesn't seem to improve, investigating further.

khawkins98 commented 5 years ago

Looks like if we use the --no-restructure option it prevents the optimisation that results in the bug.

Compression diff:

Before: 114 575 bytes (over the wire compressed: 19.4KB)
After: 119 286 bytes (over the wire compressed: 19.5KB)

5KB is probably a reasonable difference. I'll commit and we can debate about releasing to prod/test further.

https://dev.ebi.emblstatic.net/web_guidelines/EBI-Framework/v1.3/css/ebi-global.min.css

esanzgar commented 5 years ago

I was about to file an issue with csso, but found many related issues with the structural optimization. I am surprised we haven't found issues earlier.

Anyway, this is our issue with the reordering:

Before optimisation After optimisation

khawkins98 commented 5 years ago

Oof, well good that we've turned if off. Surprised it defaults to on.

esanzgar commented 5 years ago

Oof, well good that we've turned if off. Surprised it defaults to on.

Well, if no body else seem to notice... then maybe we should keep it on. It is a nice compression.

(My guess is that people notice but don't raise any issue, and they apply local patches.)