No keyboard input

[AlvaroPata]

Hi! I was trying to practice with the website, but the keyboard input is not being recognised. Also, I think the white bar is covering text (see the screenshot)...

[ranelpadon]

I tried it now and works fine: https://ranelpadon.github.io/ngram-type/

Have you tried clicking the text field by a mouse, then type something? And could you navigate the fields/sections using TAB key?

but the keyboard input is not being recognised

Not clear what you meant here:

Also, I think the white bar is covering text (see the screenshot)...

Also, please specify your:

• OS
• device (laptop, iPad, PC, etc)
• browser
• keyboard (built-in like in laptop, or external device)
• layout (Colemak, Dvorak, etc)

[ranelpadon]

@AlvaroPata closing this issue since you didn't give further details/feedback. Likewise, I don't think there's input issue on the site, since lots of users are still using it. Let me know if you think otherwise. Thanks

[ranelpadon]

@AlvaroPata My friend reported similar issue. Apparently, there's an issue when using Windows OS (both on Chrome/Firefox). Are you using Windows also? Trying to narrow down the root cause which seems to be styling issue. Thanks

[AlvaroPata]

Hi! I’m using Firefox on MacOS.

On 7. Mar 2022, at 10:30, ranelpadon @.***> wrote:

@AlvaroPata https://github.com/AlvaroPata My friend reported similar issue. Apparently, there's an issue when using Windows OS (both on Chrome/Firefox). Are you using Windows also? Trying to narrow down the root cause which seems to be styling issue. Thanks

— Reply to this email directly, view it on GitHub https://github.com/ranelpadon/ngram-type/issues/10#issuecomment-1060387088, or unsubscribe https://github.com/notifications/unsubscribe-auth/AQVGNMTP7KUO5W4LXDUI4C3U6XEFHANCNFSM5MYSOHBQ. You are receiving this because you were mentioned.

[ranelpadon]

Interesting, I'm using Firefox latest version (97.0.2) on Mac Mojave (10.14), and it looks ok:

May I know your Firefox and MacOS versions? Also, what is your monitor/screen size? I have a feeling that it could be related to monitor's height since I'm testing mainly on MacBook Pro. And my friend is using a desktop monitor on Windows.

[AlvaroPata]

I’m on Monterrey. OS: macOS 12.2.1 21D62 x86_64 Firefox: 97.0.2 (64-bit)

And it looks like this:

[ranelpadon]

@AlvaroPata Thanks, what is your monitor size? Are you using MacBook, iMac, or via external monitor? Couldn't be deduced from your screenshot.

[AlvaroPata]

I'm on a MacBook Air. Not sure about the behaviour on an external monitor, I can check it when I get the chance and tell you.

[ranelpadon]

@AlvaroPata I think I figured it out, you're using MacBook Air which I think has a smaller screen than my 15" MacBook Pro, right?

I could simulate the issue when I reduce the browser size (this is similar to the issue of my friend, and worse than yours I think):

[ranelpadon]

Also, I think a potentially workaround for now is to zoom out the page to compensate for the smaller viewport of MacBook Air. Could you please try it? Just hit the zoom-out shortcut once or twice, or until the typing input field looks ok or accessible:

[AlvaroPata]

Hi @ranelpadon, your suggested workaround works. I set the zoom to 90% and everything works as expected! Thanks for looking into it!

[ranelpadon]

@AlvaroPata Nice, glad to hear that! Thanks also for your cooperation. I still need to fix that, so that the user doesn't need to zoom out when using smaller screens, via responsive CSS. Probably, this weekend. Cheers :)

[ranelpadon]

@AlvaroPata I pushed a fix for it now and other style improvements. Please check again once you have the chance. You may need to clear your browser cache if it's still not being reflected. Looks better now on my end, and should handle even those smaller/zoomed-in screens. So, it should work even in your default zoom level: https://ranelpadon.github.io/ngram-type/

Let me know if it's indeed a fix also on your end, so that we could close this. :)