ubuntu-phone team mailing list archive

[Alan Bell <alanbell@xxxxxxxxxx>]

On 24/03/15 18:50, Alexandre Abreu wrote:
> As I said on #ubuntu-webapps, I agree, and I will add this to my TODO 
> at least to make things less strongly bounded, ... to be in a better 
> shape when we tackle things at the theme level,
now I have a handset I can play properly! It turns out (fairly obviously 
now that I think about it) that a remote webapp can't reference the 
theme on the filesystem, "/usr/share . . . " tries to load from the 
remote site and "file:///usr/share. . ." can't be loaded because of 
sensible permissions. Now if there was a local lighthttpd serving up 
nothing but the current system theme then this would be referenceable 
for both local HTML5 installed apps and remote websites to respect.
It could serve up the principal colours of the theme in a few different 
formats, what I am thinking is that websites based on bootstrap would 
check for Ubuntu in the user agent (or some better idea that is simple 
to implement) and then load the theme from something like 
http://localhost:8000/bootstrap.css which would serve up something along 
the lines of https://bootswatch.com/united/ by default, but this would 
be switchable on the handset centrally to other themes. This way you 
change the theme on the browser and all remote websites based on 
bootstrap (that have opted into this) will look consistent with each 
other and the look and feel of the handset as a whole. Flip your handset 
theme to Readable: https://bootswatch.com/readable/ and everything gets 
more contrast and bigger.

There might be other things that are not bootstrap that we could 
generate css files for and serve up in the same way, I am thinking that 
updates to the central QML theme would tweak various variables in the 
scss file that is used to build the css it serves up, the variables file 
would look a bit like this https://bootswatch.com/united/_variables.scss

I do realise that this is a bit of a new idea, but if it could be done, 
server side to support extra theme awesomeness on the phone you would do 
something like:

<?php
if(strstr($_SERVER['HTTP_USER_AGENT'],'Ubuntu' ))
 {
  echo "<link href="http://localhost:8000/bootstrap.css"; 
rel="stylesheet" type="text/css" />';
}
?>

and that is all that would be needed to get your site to optimise itself 
for the phone.

This isn't something that happens on the iPhone or Android or anything 
else - which would make it a rather interesting unique selling point if 
we did it.

Alan.