Entries: Toolbar: Fixed a typo in each description for the updatePagePadding and visibleOnPageShow options.

categories.xml

@@ -2,7 +2,22 @@
 	<category name="Uncategorized" slug="uncategorized"/>
 	<category name="Widgets" slug="widgets">
 		<desc><![CDATA[
-			<p>Widgets are feature-rich, stateful plugins that have a full life-cycle, along with methods and events. Check out the <a href="/jQuery.widget/">widget factory</a> documentation for more details.</p>
+			<p>Widgets are feature-rich, stateful plugins that have a full life-cycle, along with methods and events. Check out the <a href="http://api.jqueryui.com/jQuery.widget/">widget factory</a> documentation for more details.
+				<div class="warning"><strong>Note</strong>: The base widget (<code>$.mobile.widget</code>) is deprecated as of 1.4 and will be removed in 1.5. It is now sufficient to base your custom jQuery Mobile widgets on the jQuery UI <a href="http://api.jqueryui.com/jQuery.widget/">widget factory</a> itself. This means that in your call to <code>$.widget()</code> you can omit the base altogether.
+					<pre><code>
+$.widget( "my.widget", /* NOTE: no base needed */ {
+  options: {
+    /* ... */
+  },
+
+  _create: function() {
+    /* ... */
+  }
+
+  /* ... */
+});</code></pre>
+				</div>
+			</p>
 ]]></desc>
 	</category>
 	<category name="Events" slug="events">
@@ -12,10 +27,28 @@
 	<category name="Methods" slug="methods">
 		<desc><![CDATA[
 			<p>jQuery Mobile exposes several methods and properties on the $.mobile object for use in your applications.</p>]]></desc>
+		<category name="Path" slug="path">
+			<desc><![CDATA[
+				<p>A collection of methods for dealing with paths.</p>
+			]]></desc>
+		</category>
+	</category>
+	<category name="CSS Framework" slug="css-framework">
+		<desc><![CDATA[
+			<p>jQuery Mobile offers CSS-based enhancements for common user interface elements.</p>]]>
+		</desc>
+	</category>
+	<category name="Icons" slug="jqmicons">
+		<desc><![CDATA[
+			<p>jQuery Mobile offers a set of built-in icons that can be applied to buttons, collapsibles, listview buttons and more.</p>]]></desc>
 	</category>
 	<category name="Miscellaneous" slug="misc">
 		<desc></desc>
 	</category>
+	<category name="Properties" slug="properties">
+		<desc><![CDATA[
+			<p>jQuery Mobile exposes several properties on the $.mobile object for use in your applications.</p>]]></desc>
+	</category>
 	<category name="Reference" slug="reference">
 		<desc><![CDATA[
 			<p>The jQuery Mobile framework uses HTML5 data- attributes to allow for markup-based initialization and configuration of widgets.</p>]]></desc>

entries/classes.xml

@@ -0,0 +1,212 @@
+<?xml version="1.0"?>
+<?xml-stylesheet type="text/xsl" href="../entries2html.xsl" ?>
+<entry name="classes">
+	<title>Classes</title>
+	<desc>CSS classes for common styles</desc>
+	<longdesc>
+		<h2>Style Classes</h2>
+		<p>jQuery Mobile uses the following style classes:</p>
+		<table>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-corner-all</div></td>
+				<td>Adds rounded corners to the element.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-shadow</div></td>
+				<td>Adds an item shadow around the element.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-overlay-shadow</div></td>
+				<td>Adds an overlay shadow around the element. The intended effect is for the element to appear to float above other elements.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-mini</div></td>
+				<td>Reduces the font size and scales down paddings proportionally to produce a miniature version of the element for use in toolbars and tight spaces.</td>
+			</tr>
+		</table>
+		<p>These classes can be applied any of the framework's widgets.</p>
+		<h3>Widget-specific classes</h3>
+		<table>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-collapsible-inset</div></td>
+				<td>The <a href="/collapsible/">collapsible</a> widget has horizontal margins, borders, and rounded corners when this class is applied.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-listview-inset</div></td>
+				<td>The <a href="/listview/">listview</a> widget has horizontal margins, borders, and rounded corners when this class is applied.</td>
+			</tr>
+		</table>
+		<h3>Button-specific classes</h3>
+		<p>In addition to the style classes, you can add the following classes to <code>a</code> (anchor) and <code>button</code> elements to render them touch-friendly:</p>
+		<table>
+			<tr><th colspan="2">Basic options</th></tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn</div></td>
+				<td>You must add this class to indicate that the element is to be styled as a button. This is a prerequisite for adding any other button-related classes.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-inline</div></td>
+				<td>Displays the button inline. This means that it will only consume as much space as is needed for the label. This allows you to place buttons side by side, flowing with the text.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-shadow-icon</div></td>
+				<td>Draws a shadow around the icon. <strong>Note: This class is deprecated as of jQuery Mobile 1.4.0 and will be removed in 1.5.0.</strong></td>
+			</tr>
+			<tr><th colspan="2">Icon positioning</th></tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-icon-top</div></td>
+				<td>The icon appears above the text</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-icon-right</div></td>
+				<td>The icon appears to the right of the text</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-icon-bottom</div></td>
+				<td>The icon appears below the text</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-icon-left</div></td>
+				<td>The icon appears to the left of the text</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-icon-notext</div></td>
+				<td>The button text is suppressed, and only the icon is shown. The result is a circular button the size of the icon.</td>
+			</tr>
+			<tr><th colspan="2">Theme</th></tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-btn-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for the button. Use a single letter from a-z that maps to the swatches included in your theme. For example: <code>ui-btn-b</code></td>
+			</tr>
+		</table>
+		<h3 id="icon-classes">Icon classes</h3>
+		<p><a href="/icons/">Icons</a> are used by a variety of widgets. The table below lists all the available icon classes. The widgets which support an icon usually have an option named "icon". The value for that option is the name of the icon, which is appended to the prefix <code>ui-icon-</code> to create the icon class name. In the class list below, the icon names are emphasized as part of the icon class name.</p>
+		<table>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>alert</strong></div></td>
+				<td>An exclamation mark inside a triangle.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>arrow-l</strong></div></td>
+				<td>An arrow pointing left (&#8592;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>arrow-r</strong></div></td>
+				<td>An arrow pointing right (&#8594;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>arrow-u</strong></div></td>
+				<td>An arrow pointing up (&#8593;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>arrow-d</strong></div></td>
+				<td>An arrow pointing down (&#8595;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>back</strong></div></td>
+				<td>A curved arrow arcing counterclockwise upwards.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>bars</strong></div></td>
+				<td>Three horizontal bars one above the other.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>carat-b</strong></div></td>
+				<td>A carat pointing down (v).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>carat-l</strong></div></td>
+				<td>A carat pointing left (&gt;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>carat-r</strong></div></td>
+				<td>A carat pointing right (&lt;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>carat-t</strong></div></td>
+				<td>A carat pointing up (^).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>check</strong></div></td>
+				<td>A checkmark (&#10003;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>delete</strong></div></td>
+				<td>A diagonal cross similar to (&#10005;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>edit</strong></div></td>
+				<td>A pencil - similar to (&#9998;) but pointing to the lower left.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>forward</strong></div></td>
+				<td>A curved arrow arcing clockwise upwards.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>gear</strong></div></td>
+				<td>A gear (&#9881;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>grid</strong></div></td>
+				<td>A 3&#10005;3 grid.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>home</strong></div></td>
+				<td>A house similar to (&#8962;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>minus</strong></div></td>
+				<td>A "minus" sign (-).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>plus</strong></div></td>
+				<td>A "plus" sign (+).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>refresh</strong></div></td>
+				<td>A circular arrow similar to (&#10227;).</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>search</strong></div></td>
+				<td>A magnifying glass.</td>
+			</tr>
+			<tr>
+				<td class="enum-value"><div style="white-space: nowrap;">ui-icon-<strong>star</strong></div></td>
+				<td>A star similar to (&#10029;).</td>
+			</tr>
+		</table>
+		<h3 id="theme-classes">Theme-related classes</h3>
+		<p>The class prefixes in the table below are used for applying a swatch to various parts of the user interface. The actual class name is constructed by appending the swatch letter (a-z) to the prefix. For example, the class <code>ui-body-<strong>a</strong></code> is the swatch applied to the page.</p>
+		<table>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-bar"><div style="white-space: nowrap;">ui-bar-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for a bar. This includes headers and footers, or bars you include in the page.</td>
+			</tr>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-body"><div style="white-space: nowrap;">ui-body-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for a content block. This includes page content panes (<strong>deprecated as of 1.4.0</strong>), listview items, popups, collapsibles, the loader widget, sliders, and panels.</td>
+			</tr>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-btn"><div style="white-space: nowrap;">ui-btn-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for a button.</td>
+			</tr>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-group-theme"><div style="white-space: nowrap;">ui-group-theme-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for controlgroups, listviews, and collapsible sets (accordions).</td>
+			</tr>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-overlay"><div style="white-space: nowrap;">ui-overlay-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for backgrounds such as those of popup widgets, and page containers.</td>
+			</tr>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-page-theme"><div style="white-space: nowrap;">ui-page-theme-[a-z]</div></td>
+				<td>Sets the color scheme (swatch) for pages.</td>
+			</tr>
+			<tr>
+				<td class="enum-value" id="theme-classes-ui-panel-page-container"><div style="white-space: nowrap;">ui-panel-page-container-[a-z]</div></td>
+				<td>Panels temporarily set the theme on the page container using this class.</td>
+			</tr>
+		</table>
+	</longdesc>
+	<category slug="css-framework"/>
+</entry>