One thing I’ve discovered is that the AUI CSS reset sets the font-size to 14px instead of the 16px standard. As a result, @atlaskit/toggle
which uses measurements in REMs is drawn completely wrong because it expects a 16px standard.
This works fine in older bitbucket because the variables aren’t there, so it uses the (correct) fallback.
This works fine in Connect apps on cloud products because we own our iFrame which has the default (16px) font size, leading to correct REM calculations.
I actually think this is a defect in Toggle. I have been able to reproduce this in a minimal example on a data center app. As soon as tokens are used that refer to rem
s, the AUI CSS reset kicks in, changes the font-size
at html
to 14px, which distorts the toggle. At the least, changing the font size should change the toggle accordingly, not distort it.