construct-ui icon indicating copy to clipboard operation
construct-ui copied to clipboard

Tooltips don't fade on mobile

Open angrytongan opened this issue 4 years ago • 3 comments

Tooltips don't fade on mobile. Tested on Safari on iOS.

const {
    Button,
    Tooltip
} = CUI;

const MobileButtonTooltipNoFade = {
    view: () => {
        return m('', [
            m(Tooltip, {
                content: 'this tooltip doesn\'t fade on mobile',
                trigger: m(Button, {
                    label: 'Button',
                }),
            }),
        ]);
    }
};

document.addEventListener('DOMContentLoaded', () => {
    m.route(document.body, '/', {
        '/': MobileButtonTooltipNoFade
    });
});

Not sure if this is intended behaviour or not. Also not sure on accepted behaviour (the Material guidelines say to display for 1.5 seconds).

angrytongan avatar Jan 14 '20 02:01 angrytongan

What device/ios version are you using?

vrimar avatar Jan 15 '20 22:01 vrimar

Tested on Safari on iOS. Also in Chrome on Mac OS X using devtools mobile view.

angrytongan avatar Jan 15 '20 22:01 angrytongan

Apologies for the delay, I tested the Tooltip component in Safari/Chrome on an iPad and I can't get it to open at all. I haven't implemented any touch events so I'm assuming it won't work correctly on mobile.

I took a look at how react material UI handles it. They have dedicated touchstart/touchend events to support mobile.

I'll keep this open for the future.

vrimar avatar Jan 22 '20 03:01 vrimar