Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tooltips don't fade on mobile #9

Open
angrytongan opened this issue Jan 14, 2020 · 3 comments
Open

Tooltips don't fade on mobile #9

angrytongan opened this issue Jan 14, 2020 · 3 comments

Comments

@angrytongan
Copy link

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).

@vrimar
Copy link
Owner

vrimar commented Jan 15, 2020

What device/ios version are you using?

@angrytongan
Copy link
Author

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

@vrimar
Copy link
Owner

vrimar commented Jan 22, 2020

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants