https://github.com/jjoe64/jquery-mobile-android-theme
This is a custom jquery mobile theme, that matches the Holo theme family in Android 4.0 Theme.Holo.Dark and Theme.Holo.Light.
https://github.com/jjoe64/jquery-mobile-android-theme
Last synced: 9 days ago
JSON representation
This is a custom jquery mobile theme, that matches the Holo theme family in Android 4.0 Theme.Holo.Dark and Theme.Holo.Light.
- Host: GitHub
- URL: https://github.com/jjoe64/jquery-mobile-android-theme
- Owner: jjoe64
- Created: 2011-09-13T11:40:11.000Z (over 13 years ago)
- Default Branch: master
- Last Pushed: 2012-03-29T12:36:12.000Z (about 13 years ago)
- Last Synced: 2023-11-07T20:43:49.737Z (over 1 year ago)
- Language: JavaScript
- Homepage: http://www.jjoe64.com/2011/09/android-theme-for-jquery-mobile.html
- Size: 188 KB
- Stars: 110
- Watchers: 16
- Forks: 28
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
About
----------
This is a custom jquery mobile theme, that matches the Holo theme family in Android 4.0 Theme.Holo.Dark and Theme.Holo.Light.
http://developer.android.com/design/building-blocks/buttons.html
How to use
-----------
* Download the sources (js, css, themes-folder) from github
* Include it in your html file:
> <link rel="stylesheet" href="themes/android-theme.css" />
> <script type="text/javascript">
> var DEBUG_ANDROID_THEME=true
> </script>
> <script type="text/javascript" src="jquery.mobile.android-theme.js"></script>
Special
---------
* hide-on-android css class
use this class, to hide some elements on android devices (e.g. header back button)
How to build / customize
-------------------------
The basic css is generated with the jquery mobile theme generator.
Then all rules are wrapped with .android class. Compile it with SASS.
### Import into jquery mobile theme generator
* Go to http://jquerymobile.com/themeroller/
* Click "Import" (top-left-corner)
* Open the file android-theme.scss in any editor
* remove the line at the beginning:
body.android {
* remove the last line "}"
* copy now the content of this file into the theme generator import-window
### Export and compile
* Click on "Download-Theme"
* Name it "android-theme"
* Download it, extract and copy the file "themes/android-theme.css" to the "themes/android-theme.scss" of this project. Overwrite it.
* Wrap the complete content with body.android:
* add the line at the beginning:
body.android {
* add a closing "}" at the end of the file
* Compile it with SASS
See
-----
http://www.jjoe64.com/2011/09/android-theme-for-jquery-mobile.html