This came just in time - for more inspiration don't forget to check out Mari Sheibley's website http://mobile-patterns.com/ - shows the best patterns from the top apps, organized by pattern type.

Neat, but I want to be able to move elements around. For example, I want the little arrow here ( http://i.imgur.com/ngHiG.png ) on the right side - or gone - and changing that with CSS took me about 45 minutes the last time I tried.

You can change or remove icons by assigning CSS attributes to HTML elements when building your application. Removing the "ui-btn-icon-right" class from that button removes the arrow icon.

Unless I've misunderstood what you're trying to do.

Can you be more specific? And can I actually move them around, e.g. moving it to the left instead of the right?

Sure. Here's the complete code for the button in the demo with the icon on the left.

<a id="select-choice-1-button" class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-a ui-btn-icon-left" href="#" role="button" aria-haspopup="true" aria-owns="select-choice-1-menu" data-theme="a" data-form="ui-btn-up-a">

The documentation has more info about this here: http://jquerymobile.com/demos/1.0rc2/docs/buttons/buttons-ic...

Edit: Ah, that page says that `data-iconpos="left"` is supposed to do this. It doesn't seem to work on the demo page. :P

Excellent. I just finished rolling out two sites using jQuery Mobile and theme customization was a bit of pain. This should come in handy.

Very nice. Too bad I spent 5 weeks rolling my own already.

This is slick, especially the kuler integration.