ubuntu-phone team mailing list archive

[Olivier Tilloy <olivier.tilloy@xxxxxxxxxxxxx>]

On Fri, Aug 22, 2014 at 9:27 AM, <daniel.beck@xxxxxxxxx> wrote:

> Hi Mitchell,
>
> you could use media queries to adapth to the size of the display:
>
> @media screen and (orientation: portrait) {
>      body { background-color: white; }
>    }
>
> This can also be used with Javascript.
>
> Link: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Media_queries


As suggested by Daniel, the best solution, if you have any control over the
contents of the webapp itself, is to build it with dynamic layouts that
adapt to the available viewport.

Otherwise, the content you’ll get will probably be determined by the
user-agent that the webapp container is sending to the server, which on
devices (currently all touch devices regardless of their screen size)
contains the "Mobile" and "like Android" tokens, which in most cases will
get you mobile content.

If you need to send a different user agent based on specific conditions,
I’d recommend building a QML app that embeds an Ubuntu WebView, see
documentation there:
http://developer.ubuntu.com/api/qml/sdk-14.10/Ubuntu.Web.WebView/#getUAString-method
.

HTH,

 Olivier