CODEWITHSUNDEEP
jqueryhtmlcssmobile
eveo
eveo

Reputation: 2833

Properly skinning jQuery Mobile

Recently got a job as a front end developer at a big bank. I'm in charge of the UI. We're using jQuery Mobile.

I need a page that has all the assets of jQuery mobile so when I'm skinning, all I have to do is look at this one page.

Does anyone know where to find one?

  1. What is the proper process when skinning jQuery Mobile? It never feels right and it feels very hacky skinning it. What I do is create a new stylesheet, view whatever I want to change in Chrome/inspector, then override those classes in that new style sheet. A lot of things tend to break and I have to use a lot of special classes to fix them up.

What is your process?

Upvotes: 0

Views: 103

Answers (1)

Gaurav
Gaurav

Reputation: 1088

I am yet to find any such comprehensive guide for jQuery Mobile Theme design. But after creating 3 applications based on jQuery Mobile, here is my process to create themes.

  1. Use Theme Roller to create a theme which matches closest to one you want to design. You should be able to match basic color scheme with this.
  2. Create a custom css to override elements from Theme Roller css.
  3. Use firebug to narrow down to class you need to change to get what you want and put it in custom stylesheet.

Yes, I do agree that this is a long and tiring process. Trick is to apply style on correct classes then this works without breaking anything else.

Upvotes: 3

Related Questions