Fluent: increase send box text size to prevent unwanted zoom on mobile

OEvgeny commented 4 months ago

Fixes #5169.

Changelog Entry

Fixed send box zoomed in when clicked on mobile Safari, in PR 5192, by @OEvgeny

Description

Increase the default font size only when focused and only when both: hover is not supported and coarse pointer conditions apply.

Design

We may want to remove hover: none part to target any device with coarse pointer, but usually hover support means that there might be other ways to hover which include more precise navigation.

Specific Changes

Added needed CSS styles
Added a test

[x] I have added tests and executed them locally
[x] I have updated CHANGELOG.md
[x] ~I have updated documentation~

Review Checklist

This section is for contributors to review your work.

[x] ~Accessibility reviewed (tab order, content readability, alt text, color contrast)~
[x] ~Browser and platform compatibilities reviewed~
[x] CSS styles reviewed (minimal rules, no z-index)
[x] ~Documents reviewed (docs, samples, live demo)~
[x] ~Internationalization reviewed (strings, unit formatting)~
[x] ~package.json and package-lock.json reviewed~
[x] ~Security reviewed (no data URIs, check for nonce leak)~
[x] ~Tests reviewed (coverage, legitimacy)~

compulim commented 4 months ago

Is there any other ways than changing font size...?

OEvgeny commented 4 months ago

Is there any other ways than changing font size...?

Our users can opt-out from pinch to zoom to prevent the zoom-in action. But overall 16px min font-size on controls is a platform requirement.

compulim commented 4 months ago

Need changelog and this is good. 🙂

microsoft / BotFramework-WebChat