page themes content edits

This commit is contained in:
PattyToland 2010-10-15 16:39:57 -04:00
parent b60201b4eb
commit e23ae6e02b

View file

@ -16,13 +16,13 @@
<div data-role="content">
<h2>Theming</h2>
<h2>Page Theming</h2>
<p>jQuery Mobile has a rich <a href="../themes/index.html">theming system</a> that gives you full control of how pages are styled. There is detailed theming documentation within each page widget, but let's look at a few high-level examples of how theming is applied.</p>
<p>The <code>data-theme</code> attribute can be applied to the header and footer containers to apply any of the lettered theme color swatches. The <code>data-theme</code> attribute could be added to the content container but we recommend adding it instead to the <code>data-role="page"</code> container to ensure that the background colors are applied to the full page.</p>
<p>The <code>data-theme</code> attribute can be applied to the header and footer containers to apply any of the lettered theme color swatches. While the <code>data-theme</code> attribute could be added to the content container, we recommend adding it instead to <code>div</code> or other container that has been assigned the <code>data-role="page"</code> attribute to ensure that the background colors are applied to the full page.</p>
<p>Below are examples of theme swatches applied consistently across all page elements. Typically, you would mix and match swatches on various parts of the page to create visual texture but this shows how each theme swatch looks on various elements.</p>
<p>Below are examples of each of our default Theme's five swatches applied consistently across all page elements. Typically, you would mix and match swatches on various parts of the page to create visual texture &mdash: and the default jQuery Mobile Theme does mix and match &mdash; but this shows how each single swatch styles the various page elements:</p>