Fixed broken footer example, added a few more color variations.

This commit is contained in:
toddparker 2011-02-03 08:11:57 -05:00
parent 1c49c96b6c
commit faf36d02a1

View file

@ -12,7 +12,7 @@
<div data-role="page">
<div data-role="header" data-position="inline">
<div data-role="header">
<h1>Bar theming </h1>
</div>
@ -49,7 +49,7 @@
<h2>Theme variations</h2>
<p>This is a demo of the variation that can be achieved by tweaking the theme swatches and buttons inside the headers and footers.</p>
<h3>Headers</h3>
</div>
<div data-role="header" data-position="inline">
<h1>Bar theme "a"</h1>
@ -95,25 +95,46 @@
<a href="index.html" data-icon="arrow-r" data-iconpos="right" data-theme="b">Save</a>
</div>
<div data-role="content" class="ui-body">
<h3>Footers</h3>
</div>
<h3>Footers</h3>
<p>These are examples of a footer with link buttons inside.</p>
<div data-role="footer" data-position="inline">
<div>
<a href="index.html" data-icon="arrow-l" data-iconpos="right">left</a>
<a href="index.html" data-icon="arrow-r" data-iconpos="right">right</a>
<a href="index.html" data-icon="arrow-u" data-iconpos="right">up</a>
<a href="index.html" data-icon="arrow-d" data-iconpos="right">down</a>
<a href="index.html" data-icon="plus" data-iconpos="right">plus</a>
<a href="index.html" data-icon="minus" data-iconpos="right">minus</a>
<a href="index.html" data-icon="delete" data-iconpos="right">delete</a>
</div>
<div data-role="footer" data-theme="a">
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="right">left</a>
<a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right">right</a>
<a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="right">up</a>
<a href="index.html" data-role="button" data-icon="arrow-d" data-iconpos="right">down</a>
</div>
<div data-role="footer" data-theme="b">
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="right">left</a>
<a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right">right</a>
<a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="right">up</a>
<a href="index.html" data-role="button" data-icon="arrow-d" data-iconpos="right">down</a>
</div>
<div data-role="footer" data-theme="c">
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="right">left</a>
<a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right">right</a>
<a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="right">up</a>
</div>
<div data-role="footer" data-theme="d">
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="right">left</a>
<a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right">right</a>
<a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="right">up</a>
<a href="index.html" data-role="button" data-icon="arrow-d" data-iconpos="right">down</a>
</div>
<div data-role="footer" data-theme="e">
<a href="index.html" data-role="button" data-icon="arrow-l" data-iconpos="right">left</a>
<a href="index.html" data-role="button" data-icon="arrow-r" data-iconpos="right">right</a>
<a href="index.html" data-role="button" data-icon="arrow-u" data-iconpos="right">up</a>
<a href="index.html" data-role="button" data-icon="arrow-d" data-iconpos="right">down</a>
</div>
<p></p>
</div>
</body>