Skip to content

Commit 404f08e

Browse files
author
Gabriel Schulhof
committed
Fixing theme swatch examples: b is the new dark swatch (replacing a) and a is the new default swatch (replacing c). All higher swatches ([c-z]) have been replaced with a.
1 parent a1ef950 commit 404f08e

File tree

165 files changed

+121
-414
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

165 files changed

+121
-414
lines changed

entries/button.xml

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -194,15 +194,15 @@ $( "[type='submit']" ).button();
194194
<p>Buttons can be manually assigned any of the button color swatches from the theme to add visual contrast with the container they sit inside by adding the <code>data-theme</code> attribute on the button markup and specifying a swatch letter.</p>
195195

196196
<pre><code>
197-
&lt;a href=&quot;index.html&quot; data-role=&quot;button&quot; data-theme=&quot;a&quot;&gt;Swatch a&lt;/a&gt;
197+
&lt;a href=&quot;index.html&quot; data-role=&quot;button&quot; data-theme=&quot;b&quot;&gt;Swatch b&lt;/a&gt;
198198
</code></pre>
199199

200-
<p>Here are 5 buttons with icons that have a different swatch letter assigned via the <code>data-theme</code> attribute.
200+
<p>Here are 2 buttons with icons that have a different swatch letter assigned via the <code>data-theme</code> attribute.
201201
<iframe src="/resources/button/example34.html" style="width:100%;height:90px;border:0px"></iframe></p>
202202

203203
<h3>Theme variations</h3>
204204

205-
<p><iframe src="/resources/button/example35.html" style="width:100%;height:630px;border:0px"></iframe></p>
205+
<p><iframe src="/resources/button/example35.html" style="width:100%;height:330px;border:0px"></iframe></p>
206206

207207
<h2>Providing pre-rendered markup</h2>
208208
<p>You can improve the load time for your page by providing the markup that the button widget would normally create during its initialization.</p>
@@ -309,10 +309,10 @@ $( "a" ).buttonMarkup({ shadow: false });
309309
<option name="theme" default="null, inherited from parent">
310310
<desc><p>Sets the color scheme (swatch) for all instances of this widget. It accepts a single letter from a-z that maps to one of the swatches included in your theme. By default, it will inherit the same swatch color as its parent container if not explicitly set.</p>
311311
<pre><code>
312-
$( "a" ).buttonMarkup({ theme: "a" });
312+
$( "a" ).buttonMarkup({ theme: "b" });
313313
</code></pre>
314314
<p>Possible values: swatch letter (a-z).</p>
315-
<p>This option is also exposed as a data attribute: <code>data-theme="a"</code>.
315+
<p>This option is also exposed as a data attribute: <code>data-theme="b"</code>.
316316
<iframe src="/resources/button/example47.html" style="width:100%;height:90px;border:0px"></iframe></p>
317317
</desc>
318318
<type name="String" />

entries/checkboxradio.xml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -180,11 +180,11 @@ $( "input[type='checkbox']" ).checkboxradio({ enhanced: true });
180180
</desc>
181181
<type name="Boolean" />
182182
</option>
183-
<option name="theme" default="null, inherited from parent" example-value='"a"'>
184-
<desc>Sets the color scheme (swatch) for all instances of this widget. It accepts a single letter from a-z that maps to the swatches included in your theme. By default, it will inherit the same swatch color as its parent container if not explicitly set.
183+
<option name="theme" default="null, inherited from parent" example-value='"b"'>
184+
<desc>Sets the color scheme (swatch) for this widget. It accepts a single letter from a-z that maps to the swatches included in your theme. By default, it will inherit the same swatch color as its parent container if not explicitly set.
185185

186186
<p>Possible values: swatch letter (a-z).</p>
187-
<p>This option is also exposed as a data attribute: <code>data-theme="a"</code>.</p>
187+
<p>This option is also exposed as a data attribute: <code>data-theme="b"</code>.</p>
188188
</desc>
189189
<type name="String" />
190190
</option>

entries/collapsible.xml

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -69,9 +69,9 @@
6969
<p>To provide a stronger visual connection between the collapsible header and content, add the <code>data-content-theme</code> attribute to the wrapper and specify a theme swatch letter. This applies the border and background color of the swatch to the content block and changes the corner rounding to square off the bottom of the header and round the bottom of the content block instead to visually group these elements.</p>
7070

7171
<pre><code>
72-
&lt;div data-role=&quot;collapsible&quot; data-content-theme=&quot;a&quot;&gt;
72+
&lt;div data-role=&quot;collapsible&quot; data-content-theme=&quot;b&quot;&gt;
7373
&lt;h3&gt;Header&lt;/h3&gt;
74-
&lt;p&gt;I&#x27;m the collapsible content with a themed content block set to "a".&lt;/p&gt;
74+
&lt;p&gt;I&#x27;m the collapsible content with a themed content block set to "b".&lt;/p&gt;
7575
&lt;/div&gt;
7676
</code></pre>
7777

@@ -81,9 +81,9 @@
8181

8282
<p>To set the theme on a collapsible header button, add the <code>data-theme</code> attribute to the wrapper and specify a swatch letter. Note that you can mix and match swatch letters between the header and content with these theme attributes.</p>
8383

84-
<pre><code>&lt;div data-role=&quot;collapsible&quot; data-theme=&quot;a&quot; data-content-theme=&quot;a&quot;&gt;
85-
&lt;h3&gt;Header swatch A&lt;/h3&gt;
86-
&lt;p&gt;I&#x27;m the collapsible content with a themed content block set to "a".&lt;/p&gt;
84+
<pre><code>&lt;div data-role=&quot;collapsible&quot; data-theme=&quot;b&quot; data-content-theme=&quot;b&quot;&gt;
85+
&lt;h3&gt;Header swatch B&lt;/h3&gt;
86+
&lt;p&gt;I&#x27;m the collapsible content with a themed content block set to "b".&lt;/p&gt;
8787
&lt;/div&gt;
8888
</code></pre>
8989

@@ -197,11 +197,11 @@
197197
</desc>
198198
<type name="Boolean" />
199199
</option>
200-
<option name="theme" default="null, inherited from parent" example-value='"a"'>
200+
<option name="theme" default="null, inherited from parent" example-value='"b"'>
201201
<desc>Sets the color scheme (swatch) for the collapsible. It accepts a single letter from a-z that maps to the swatches included in your theme.
202202
<p>If the value is unset for an individual collapsible container, but that container is part of a collapsible set, then the value is inherited from the parent collapsible set.</p>
203203
<p>Possible values: swatch letter (a-z).</p>
204-
<p>This option is also exposed as a data attribute: <code>data-theme="a"</code>.</p>
204+
<p>This option is also exposed as a data attribute: <code>data-theme="b"</code>.</p>
205205
</desc>
206206
<type name="String" />
207207
</option>

entries/collapsibleset.xml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@
5353

5454
<p>The standard <code>data-theme</code> attribute can be used to set the color of each collapsible in a set. To provide a clearer visual grouping of the content with the headers, add the <code>data-content-theme</code> attribute with a swatch letter. This adds a themed background color and border to the content block. For consistent theming, add these attributes to the parent collapsible set.
5555

56-
<pre><code>&lt;div data-role=&quot;collapsibleset&quot; data-theme=&quot;a&quot; data-content-theme=&quot;b&quot;&gt;
56+
<pre><code>&lt;div data-role=&quot;collapsibleset&quot; data-theme=&quot;b&quot; data-content-theme=&quot;a&quot;&gt;
5757
</code></pre>
5858

5959
<iframe src="/resources/collapsibleset/example6.html" style="width:100%;height:240px;border:0px"></iframe></p>
@@ -138,10 +138,10 @@
138138
</desc>
139139
<type name="Boolean" />
140140
</option>
141-
<option name="theme" default="null, inherited from parent" example-value='"a"'>
141+
<option name="theme" default="null, inherited from parent" example-value='"b"'>
142142
<desc>Sets the color scheme (swatch) for the collapsible set. It accepts a single letter from a-z that maps to the swatches included in your theme.
143143
<p>Possible values: swatch letter (a-z).</p>
144-
<p>This option is also exposed as a data attribute: <code>data-theme="a"</code>.</p>
144+
<p>This option is also exposed as a data attribute: <code>data-theme="b"</code>.</p>
145145
</desc>
146146
<type name="String" />
147147
</option>

entries/dialog.xml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -120,11 +120,11 @@ $( document ).on( "mobileinit", function() {
120120
</desc>
121121
<type name="CSS selector string" />
122122
</option>
123-
<option name="overlayTheme" default='"a"' example-value='"e"'>
123+
<option name="overlayTheme" default='"a"' example-value='"b"'>
124124
<desc>
125125
<p>Dialogs appear to be floating above an overlay layer. This overlay adopts the swatch A content color by default, but the data-overlay-theme attribute can be added to the page wrapper to set the overlay to any swatch letter.</p>
126126
<p> Possible values: swatch letter (a-z)</p>
127-
<p>This option is also exposed as a data attribute: <code>data-overlay-theme="e"</code>.</p>
127+
<p>This option is also exposed as a data attribute: <code>data-overlay-theme="b"</code>.</p>
128128
</desc>
129129
<type name="String" />
130130
</option>

entries/fixedtoolbar.xml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -195,7 +195,7 @@ $( document ).on( "mobileinit", function() {
195195
</methods>
196196
<example>
197197
<desc>A basic example of a page with fixed toolbars.</desc>
198-
<html><![CDATA[<div data-role="header" <div data-role="header" data-position="fixed" data-theme="a">
198+
<html><![CDATA[<div data-role="header" <div data-role="header" data-position="fixed" data-theme="b">
199199
<h1>Fixed Header</h1>
200200
</div>
201201
<div data-role="content" >
@@ -210,7 +210,7 @@ $( document ).on( "mobileinit", function() {
210210
<p></p>
211211
212212
</div>
213-
<div data-role="footer" data-theme="a" data-position="fixed">
213+
<div data-role="footer" data-theme="b" data-position="fixed">
214214
<h1>Fixed Footer</h1>
215215
</div>]]></html>
216216
</example>

entries/grid-layout.xml

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535

3636
<pre><code>
3737
&lt;fieldset class="ui-grid-a"&gt;
38-
&lt;div class="ui-block-a"&gt;&lt;button type="submit" data-theme="c"&gt;Cancel&lt;/button&gt;&lt;/div&gt;
38+
&lt;div class="ui-block-a"&gt;&lt;button type="submit" data-theme="a"&gt;Cancel&lt;/button&gt;&lt;/div&gt;
3939
&lt;div class="ui-block-b"&gt;&lt;button type="submit" data-theme="b"&gt;Submit&lt;/button&gt;&lt;/div&gt;
4040
&lt;/fieldset&gt;
4141
</code></pre>
@@ -45,8 +45,8 @@
4545

4646
<pre><code>
4747
&lt;div class="ui-grid-a"&gt;
48-
&lt;div class="ui-block-a"&gt;&lt;button type="button" data-theme="c"&gt;Previous&lt;/button&gt;&lt;/div&gt;
49-
&lt;div class="ui-block-b"&gt;&lt;button type="button" data-theme="c"&gt;Next&lt;/button&gt;&lt;/div&gt;
48+
&lt;div class="ui-block-a"&gt;&lt;button type="button" data-theme="a"&gt;Previous&lt;/button&gt;&lt;/div&gt;
49+
&lt;div class="ui-block-b"&gt;&lt;button type="button" data-theme="a"&gt;Next&lt;/button&gt;&lt;/div&gt;
5050
&lt;/div&gt;
5151
&lt;div class="ui-grid-solo"&gt;
5252
&lt;div class="ui-block-a"&gt;&lt;button type="v" data-theme="b"&gt;More&lt;/button&gt;&lt;/div&gt;

entries/listview.xml

Lines changed: 8 additions & 62 deletions
Original file line numberDiff line numberDiff line change
@@ -160,94 +160,40 @@ $( "#mylist" ).listview( "refresh" );
160160
</longdesc>
161161
<added>1.0</added>
162162
<options>
163-
<option name="countTheme" default='"c"' example-value='"a"'>
164-
<desc>Sets the color scheme (swatch) for list item count bubbles. It accepts a single letter from a-z that maps to one of the swatches included in your theme.
165-
<p>This option is also exposed as a data attribute: <code>data-count-theme="a"</code>.</p>
166-
</desc>
167-
<type name="String" />
168-
</option>
169-
<option name="dividerTheme" default='"b"' example-value='"a"'>
163+
<option name="dividerTheme" default='null, inherited from parent' example-value='"b"'>
170164
<desc>Sets the color scheme (swatch) for list dividers. It accepts a single letter from a-z that maps to one of the swatches included in your theme.
171-
<p>This option is also exposed as a data attribute: <code>data-divider-theme="a"</code>.</p>
165+
<p>This option is also exposed as a data attribute: <code>data-divider-theme="b"</code>.</p>
172166
</desc>
173167
<type name="String" />
174168
</option>
175-
<option name="filter" default="false" example-value="true">
176-
<desc>Adds a search filter bar to listviews.
177-
<p>This option is also exposed as a data attribute: <code>data-filter="true"</code>.</p>
178-
</desc>
179-
<type name="Boolean" />
180-
</option>
181-
<option name="filterCallback" default="n/a">
182-
<desc>The function to determine which rows to hide when the search filter textbox changes. The function accepts two arguments -- the text of the list item (or data-filtertext value if present), and the search string. Return true to hide the item, false to leave it visible.
183-
<pre><code>
184-
$( document ).on( "mobileinit", function() {
185-
$.mobile.listview.prototype.options.filterCallback = function( text, searchValue ) {
186-
// only show items that *begin* with the search string
187-
return text.toLowerCase().substring( 0, searchValue.length ) !== searchValue;
188-
};
189-
});</code></pre>
190-
</desc>
191-
<type name="Function" />
192-
</option>
193-
<option name="filterPlaceholder" default='"Filter items..."' example-value='Search..."'>
194-
<desc>The placeholder text used in search filter bars.
195-
<p>This option is also exposed as a data attribute: <code>data-filter-placeholder="Search..."</code>.</p>
196-
</desc>
197-
<type name="String" />
198-
</option>
199-
<option name="filterTheme" default='"c"' example-value='"a"'>
200-
<desc>Sets the color scheme (swatch) for the search filter bar. It accepts a single letter from a-z that maps to one of the swatches included in your theme.
201-
<p>This option is also exposed as a data attribute: <code>data-filter-theme="a"</code>.</p>
202-
</desc>
203-
<type name="String" />
204-
</option>
205-
<option name="headerTheme" default='"c"' example-value='"a"'>
206-
<desc>Sets the color scheme (swatch) for headers of nested list sub pages. It accepts a single letter from a-z that maps to one of the swatches included in your theme.
207-
<p>This option is also exposed as a data attribute: <code>data-header-theme="a"</code>.</p>
208-
</desc>
209-
<deprecated>1.3</deprecated>
210-
<type name="String" />
211-
212-
</option>
213-
<option name="icon" default='"arrow-r"' example-value='"star"'>
169+
<option name="icon" default='"carat-r"' example-value='"star"'>
214170
<desc>Applies an icon from the icon set to all linked list buttons.
215171
<p>This option is also exposed as a data attribute: <code>data-icon="star"</code>.</p>
216172
</desc>
217173
<type name="String" />
218174
</option>
219-
<option name="initSelector" default=":jqmData(role='listview')">
220-
<desc>This is used to define the selectors (element types, data roles, etc.) that will automatically be initialized as listviews.
221-
<pre><code>
222-
$( document ).on( "mobileinit", function() {
223-
$.mobile.listview.prototype.options.initSelector = ".mylistview";
224-
});
225-
</code></pre>
226-
</desc>
227-
<type name="CSS selector string" />
228-
</option>
229175
<option name="inset" default="false" example-value="true">
230176
<desc>Adds inset list styles.
231177
<p>This option is also exposed as a data attribute: <code>data-inset="true"</code>.</p>
232178
</desc>
233179
<type name="Boolean" />
234180
</option>
235-
<option name="splitIcon" default='"arrow-r"' example-value='"star"'>
181+
<option name="splitIcon" default='"carat-r"' example-value='"star"'>
236182
<desc>Applies an icon from the icon set to all split list buttons.
237183
<p>This option is also exposed as a data attribute: <code>data-split-icon="star"</code>.</p>
238184
</desc>
239185
<type name="String" />
240186
</option>
241-
<option name="splitTheme" default='"b"' example-value='"a"'>
187+
<option name="splitTheme" default='null, inherited from parent' example-value='"b"'>
242188
<desc>Sets the color scheme (swatch) for split list buttons. It accepts a single letter from a-z that maps to one of the swatches included in your theme.
243-
<p>This option is also exposed as a data attribute: <code>data-split-theme="a"</code>.</p>
189+
<p>This option is also exposed as a data attribute: <code>data-split-theme="b"</code>.</p>
244190
</desc>
245191
<type name="String" />
246192
</option>
247-
<option name="theme" default="null, inherited from parent" example-value='"a"'>
193+
<option name="theme" default="null, inherited from parent" example-value='"b"'>
248194
<desc>Sets the color scheme (swatch) for this widget. It accepts a single letter from a-z that maps to one of the swatches included in your theme. By default, it will inherit the same swatch color as its parent container if not explicitly set.
249195
<p>Possible values: swatch letter (a-z).</p>
250-
<p>This option is also exposed as a data attribute: <code>data-theme="a"</code>.</p>
196+
<p>This option is also exposed as a data attribute: <code>data-theme="b"</code>.</p>
251197
</desc>
252198
<type name="String" />
253199
</option>

entries/page-loading.xml

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@
5151
<desc>If true, the text value will be used under the spinner.</desc>
5252
<type name="boolean" />
5353
</option>
54-
<option name="theme" default="a" example-value='"b"'>
54+
<option name="theme" default="b" example-value='"a"'>
5555
<desc>Sets the color scheme (swatch) for the loading message. It accepts a single letter from a-z that maps to the swatches included in your theme.</desc>
5656
<type name="string" />
5757
</option>
@@ -137,16 +137,13 @@
137137
]]></code>
138138
<html><![CDATA[
139139
<div data-role="controlgroup">
140-
<button class="show-page-loading-msg" data-theme="a" data-textonly="false" data-textvisible="false" data-msgtext="" data-icon="arrow-r" data-iconpos="right">Default loader</button>
141-
<button class="show-page-loading-msg" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Text only loader" data-icon="arrow-r" data-iconpos="right">Text only</button>
142-
<button class="show-page-loading-msg" data-theme="a" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme a" data-icon="arrow-r" data-iconpos="right">Theme a</button>
143-
<button class="show-page-loading-msg" data-theme="b" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme b" data-icon="arrow-r" data-iconpos="right">Theme b</button>
144-
<button class="show-page-loading-msg" data-theme="c" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme c" data-icon="arrow-r" data-iconpos="right">Theme c</button>
145-
<button class="show-page-loading-msg" data-theme="d" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme d" data-icon="arrow-r" data-iconpos="right">Theme d</button>
146-
<button class="show-page-loading-msg" data-theme="e" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme e" data-icon="arrow-r" data-iconpos="right">Theme e</button>
147-
<button class="show-page-loading-msg" data-theme="a" data-textonly="true" data-textvisible="true" data-msgtext="Custom Loader" data-icon="arrow-r" data-html="<span class='ui-bar ui-overlay-c ui-corner-all'><img src='../_assets/images/jquery-logo.png' /><h2>is loading for you ...</h2></span>" data-iconpos="right">Custom HTML</button>
140+
<button class="show-page-loading-msg" data-theme="b" data-textonly="false" data-textvisible="false" data-msgtext="" data-icon="arrow-r" data-iconpos="right">Default loader</button>
141+
<button class="show-page-loading-msg" data-theme="b" data-textonly="true" data-textvisible="true" data-msgtext="Text only loader" data-icon="arrow-r" data-iconpos="right">Text only</button>
142+
<button class="show-page-loading-msg" data-theme="b" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme a" data-icon="arrow-r" data-iconpos="right">Theme a</button>
143+
<button class="show-page-loading-msg" data-theme="a" data-textonly="false" data-textvisible="true" data-msgtext="Loading theme b" data-icon="arrow-r" data-iconpos="right">Theme b</button>
144+
<button class="show-page-loading-msg" data-theme="b" data-textonly="true" data-textvisible="true" data-msgtext="Custom Loader" data-icon="arrow-r" data-html="<span class='ui-bar ui-overlay-c ui-corner-all'><img src='../_assets/images/jquery-logo.png' /><h2>is loading for you ...</h2></span>" data-iconpos="right">Custom HTML</button>
148145
<button class="hide-page-loading-msg" data-icon="delete" data-iconpos="right">Hide</button>
149146
</div> ]]></html>
150147
</example>
151148
<category slug="widgets"/>
152-
</entry>
149+
</entry>

entries/page.xml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,10 +27,10 @@
2727
</desc>
2828
<type name="String" />
2929
</option>
30-
<option name="theme" default="c" example-value='"a"'>
30+
<option name="theme" default="a" example-value='"b"'>
3131
<desc>
3232
<p>Sets the swatch that will be used to draw the page.</p>
33-
<p>This option is also exposed as a data attribute: <code>data-theme="a"</code>.</p>
33+
<p>This option is also exposed as a data attribute: <code>data-theme="b"</code>.</p>
3434
</desc>
3535
<type name="String" />
3636
</option>

0 commit comments

Comments
 (0)