How do I 'scale' the UI to a readable size

Question

When I display my app on a device, the fonts, icons and buttons are unusably small. This is especially true on a tablet.

How can I easily scale up all of of my UI components?

Answer 1

Make sure the following meta tag is included in your app html file:

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">

If you still feel that the buttons and text are to small (which the should be a personal preference) you could always try changing the css. Add a new rule like this:

body {
    font-size: 140% !important; //I believe 114% is default
}

Hope it helps.