Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-03-16 22:10:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

more revisions to converter typography

Browse source
This commit is contained in:
Todd Parker 2010-10-19 12:33:17 -04:00
parent c2726c865a
commit 1144425325
2 changed files with 36 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
experiments/converter/converter.css
View file

@ -1,6 +1,14 @@
ul li { clear:both; }
li p.units { padding-top:23px; font-size: 110%; font-weight:bold; }
li p.units a:link, li p.units a:visited { padding-top:26px; font-size: 90%; }
li p.currency-from { padding-top:23px; font-size: 180%; font-weight:bold; }
li p.currency-from a:link, li p.units a:visited { padding-top:26px; font-size: 90%; }
span.unit { opacity:0.5; }
li p.subtext { margin-top:2px; }
li p.ui-li-aside { font-size:190%; }
li p.ui-li-aside { font-size:190%; width:60%; }
form#curr-form { border-width: 0; overflow: hidden; margin: 2px -15px 2px -15px }
form#curr-form .ui-input-search { margin: 5px; width: auto; display: block; }
.add-row { font-weight:bold; font-size:110%; }

39
experiments/converter/index.html
View file

@ -35,17 +35,28 @@
<h1>Currency converter</h1>
</div>
<div class="ui-bar ui-bar-a">
<form method="get" action="" data-role="autoform" >
<form method="get" action="" data-role="autoform" id="curr-form">
<label for="term" data-role="nojs">Search:</label>
<input type="search" name="term" id="term" placeholder="Type a value..." value="1" />
<input type="search" name="term" id="term" placeholder="Type a value..." value="25" />
</form>
</div>
<div data-role="content">
<ul id="++conversions" data-role="listview" data-theme="a">
<li><p class="units">$ TO &euro;</p><p class="ui-li-aside">22.34</p></li>
<li><p class="units">$ TO &euro;</p><p class="ui-li-aside">22.34</p></li>
<li><p class="units">$ TO &euro;</p><p class="ui-li-aside">22.34</p></li>
<li><p class="units">$ TO &euro;</p><p class="ui-li-aside">22.34</p></li>
<li><p class="currency-from">$ <span class="unit">USD</span></p>
<p class="currency-to ui-li-aside">&euro; 22.34 <span class="unit">EUR</span></p>
</li>
<li><p class="currency-from">$ <span class="unit">USD</span></p>
<p class="currency-to ui-li-aside">&pound; 22.34 <span class="unit">GBP</span></p>
</li>
<li><p class="currency-from">$ <span class="unit">USD</span></p>
<p class="currency-to ui-li-aside">&yen; 22.34 <span class="unit">JPY</span></p>
</li>
<li><p class="currency-from">&euro; <span class="unit">EUR</span></p>
<p class="currency-to ui-li-aside">$ 22.34 <span class="unit">USD</span></p>
</li>
<li><p class="currency-from">&yen; <span class="unit">EUR</span></p>
<p class="currency-to ui-li-aside">$ 22.34 <span class="unit">JPY</span></p>
</li>
</ul>
</div>
</div>
@ -59,11 +70,11 @@
<div data-role="content">
<ul data-role="listview" data-theme="c" data-inset="true">
<li><p class="units"><a href="#add-currency-dialog">$ to &euro;</a></p><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><p class="units"><a href="#add-currency-dialog">$ to &euro;</a></p><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><p class="units"><a href="#add-currency-dialog">$ to &euro;</a></p><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><p class="units"><a href="#add-currency-dialog">$ to &euro;</a></p><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><a href="#add-currency-dialog"><strong>Add new conversion</strong></a><p class="subtext">Choose any two currencies to convert</p></li>
<li><a href="#add-currency-dialog">$ <span class="unit">USD</span> to &euro; <span class="unit">EUR</span><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><a href="#add-currency-dialog">$ <span class="unit">USD</span> to &euro; <span class="unit">EUR</span><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><a href="#add-currency-dialog">$ <span class="unit">USD</span> to &euro; <span class="unit">EUR</span><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><a href="#add-currency-dialog">$ <span class="unit">USD</span> to &euro; <span class="unit">EUR</span><a href="remove" data-icon="delete" data-iconpos="notext">Remove</a></li>
<li><a href="#add-currency-dialog" class="add-row">Add new...</a></li>
</ul>
</div>
<div class="ui-body">
@ -74,7 +85,7 @@
<div data-role="page" id="add-currency-dialog" class="ui-body-b">
<div data-role="header" data-theme="a">
<h1>Add new</h1>
<a href="#start" class="ui-back" data-icon="arrow-l" >Cancel</a>
<a href="#customize" class="ui-back" data-icon="arrow-l">Cancel</a>
</div>
<div data-role="content">
@ -96,8 +107,8 @@
</select>
</div>
<div data-role="fieldcontain">
<a id="add" href="#start" data-role="button" data-theme="c" data-inline="true">Cancel</a>
<a id="add" href="#start" data-role="button" data-theme="b" data-inline="true">Add conversion</a>
<a id="add" href="#customize" data-role="button" data-theme="c" data-inline="true">Cancel</a>
<a id="add" href="#customize" data-role="button" data-theme="b" data-inline="true">Add conversion</a>
</div>
</div>
</div>