I was thinking about developing some web-based apps with a mobile version which looks/behaves similarly to native Maemo 5 apps (with the standard theme).

So far I have styled buttons and list items:


Would it be worth me starting a project in Maemo Garage so that others can use and contribute to the stylesheet theme? The background gradients are the only images currently in use - corners are styled using CSS3.

Would there be problems with me replicating the gradients (I took a screen capture from my device) from the built in 'nokia nseries' theme? Just wanted to check before I released/used it properly.

Also, this may (or may not) tie together nicely with 'Nokia Web Runtime' - if apps were going to be developed using that - not sure exactly how Nokia Web Runtime is going to work though, most of what I skim-read earlier talked about desktop widgets.

Thanks!

Well, just today I went looking for exactly such a thing and found only this... strange that there was no follow-up !

Is there a CSS file available somewhere to mimic the default Fremantle theme ?

Hi - this is a bit of a blast-from-the-past!

I'm currently using the CSS I made on my AFL Player Numbers mobile site:
http://playernumbers.com.au/

Because there wasn't any interest, I didn't go to the bother of setting up a public repository for the theme - feel free to download the css/images from that site.

If you're wanting to extend the css to include other styled html 'widgets', let me know and I'll set up a public repository somewhere for it.

Thanks a lot ! Buttons & lists should be enough for now, I'll ping you if I add any others.

As for the blast-from-the-past, they do say no good deed ever goes unpunished :-)

Hi, me again :-)

The "Maemo5 illusion" on your web site up there is very good on a PC with Firefox and a mouse... However, when I access it from MicroB on the N900, I don't get the "blue hover" effect when finger-scrolling the list... the background of the touched item does flash briefly, but with some shade of grey.

Do you see the same thing ? Is this on purpose, or a limitation of the N900 browser ?

Just for fun, here's a quick comparison of how the style sheet fares on the various Maemo browsers I have easy access to, ie :

Under Maemo4 (Diablo, N810) :
Micro-B (native, gecko-based)
Tear (third-party, Webkit-based)

Under Maemo4 (Fremantle, N900) :
Micro-B (native, gecko-based)
Firefox (third-party, gecko-based)
Macuco (third-party, Webkit-based)

Simply put, the N900 native browser is the worst of all, visually speaking, as far as reproducing the Fremantle UI is concerned. The blue background never appears while finger-scrolling a list around, only when actually selecting an item (ie just before changing pages...). If you look really close there is a dark grey background sometimes.

All others show the correct bg color while scrollling, even good old Diablo MicroB. Firefox on N900 is very choppy and leaves blue trails. Webkit-based browsers seem better at it : Tear is passable under Diablo, and Macuco is the overall winner on N900 : very fluid, and visually closest to the native UI.

So you thought the days of CSS-hell were behind us ? Think again :-)

Thanks for the research!

It has been a very long time since I played with it, but I seem to remember some issues with :hover on MicroB, and settled for just a 'click' effect instead. I think it was something to do with the fact that there was a 'hidden' mouse pointer, so as you scrolled the list the wrong item would highlight. The 'hidden/virtual' mouse pointer would only change position on a press, so the area of the screen which you pressed last would show the hover effect when scrolling.