Vue-material: [MdInput] Zooming when focusing input-fields on iOS

[Bolandish]

Hi!

When focusing input-fields on iOS the device zooms into the field.
See my gif.

[pablohpsilva]

Hello! Thank you for opening this issue.

Could you please provide a gif instead of a png? I just want to make sure before replying what I think the issue can be.

Thanks!

[Bolandish]

Ah, Sorry @pablohpsilva ! I Dont know what happened :)

[Samuell1]

Closing this issue as our focus is on the new 1.0.0 version.

[qubitron]

@Samuell1 This issue happens for me in the 1.0.0-beta7 version, consider re-opening

[Samuell1]

Its not issue on our side, its because iOS have autozoom for inputs. And its default behavior for Mobile Safari. @qubitron

[qubitron]

@Samuell1 From the hint in #417 I was able to figure out this is happening because the md-input has an initial font size of 1px, causing the auto-zoom to zoom in way too far when you tap on the input control.

I was able to fix this issue by putting the following style in my App.vue:

.md-input {
  font-size: 16px !important;
}

It seems like this could be a simple fix to change the font-size to 16px. Without it, the the vue-material framework is unusable for me on mobile devices, and with this change it works great.

[Samuell1]

@qubitron for now use that temp css to fix it, if everything will be okay with changing font-size, we add it in next version.

@marcosmoura can we change font-size to 16px? Its not used for some animations?