forked from enathu/jqmobile-android-holo-light-theme
-
Notifications
You must be signed in to change notification settings - Fork 0
/
example.html
80 lines (67 loc) · 3.65 KB
/
example.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
<!DOCTYPE html>
<html>
<head>
<title>Android Holo Light Theme for JQuery Mobile</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="themes/android-holo-light.min.css" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.0/jquery.mobile.structure-1.1.0.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.0/jquery.mobile-1.1.0.min.js"></script>
</head>
<body>
<div class="preview ui-shadow swatch">
<div class="ui-header ui-bar-a" data-swatch="a" data-theme="a" data-form="ui-bar-a" data-role="header" role="banner">
<a class="ui-btn-left ui-btn ui-btn-icon-notext ui-btn-corner-all ui-shadow ui-btn-up-a" data-iconpos="notext" data-theme="a" data-role="button" data-icon="home" title=" Home ">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text"> Home </span>
<span data-form="ui-icon" class="ui-icon ui-icon-home ui-icon-shadow"></span>
</span>
</a>
<h1 class="ui-title" tabindex="0" role="heading" aria-level="1">Holo Light Demo</h1>
<a class="ui-btn-right ui-btn ui-btn-icon-notext ui-btn-corner-all ui-shadow ui-btn-up-a" data-iconpos="notext" data-theme="a" data-role="button" data-icon="grid" title=" Navigation ">
<span class="ui-btn-inner ui-btn-corner-all">
<span class="ui-btn-text"> Navigation </span>
<span data-form="ui-icon" class="ui-icon ui-icon-grid ui-icon-shadow"></span>
</span>
</a>
</div>
<div class="ui-content ui-body-a" data-theme="a" data-form="ui-body-a" data-role="content" role="main">
<p>
Sample text and <a class="ui-link" data-form="ui-body-a" href="#" data-theme="a">links</a>.
</p>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<li data-swatch="a" class="ui-li ui-li-divider ui-btn ui-bar-a ui-corner-top" data-role="list-divider" role="" data-form="ui-bar-a">List Header</li>
<input type="radio" name="radio-choice-a" id="radio-choice-1-a" value="choice-1" checked="checked" />
<label for="radio-choice-1-a" data-form="ui-btn-up-a" class="ui-corner-none">Radio 1</label>
<input type="radio" name="radio-choice-a" id="radio-choice-2-a" value="choice-2" />
<label for="radio-choice-2-a" data-form="ui-btn-up-a">Radio 2</label>
<input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" checked="checked" />
<label for="checkbox-1" data-form="ui-btn-up-a">Checkbox</label>
</fieldset>
</div>
<div data-role="fieldcontain">
<fieldset data-role="controlgroup" data-type="horizontal">
<input type="radio" name="radio-view-a" id="radio-view-a-a" value="list" checked="checked"/>
<label for="radio-view-a-a" data-form="ui-btn-up-a">On</label>
<input type="radio" name="radio-view-a" id="radio-view-b-a" value="grid" />
<label for="radio-view-b-a" data-form="ui-btn-up-a">Off</label>
</fieldset>
</div>
<div data-role="fieldcontain">
<select name="select-choice-1" id="select-choice-1" data-native-menu="false" data-theme="a" data-form="ui-btn-up-a">
<option value="standard">Option 1</option>
<option value="rush">Option 2</option>
<option value="express">Option 3</option>
<option value="overnight">Option 4</option>
</select>
</div>
<input type="text" value="Text Input" class="input" data-form="ui-body-a" />
<div data-role="fieldcontain">
<input type="range" name="slider" value="50" min="0" max="100" data-form="ui-body-a" data-theme="a" data-highlight="true" />
</div>
<button data-icon="star" data-theme="a" data-form="ui-btn-up-a">Button</button>
</div>
</div>
</body>
</html>