javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

range tests

Browse Source
This commit is contained in:
Adam Bradley
2013-12-05 23:43:26 -06:00
parent 390e51d1e0
commit 29b1008c35
1 changed files with 30 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
test/input-range.html
View File

@@ -17,66 +17,84 @@
<p>
Level of Awesomeness:
<input type="range" name="awesomeness" min="0" max="10" value="10">
<input type="range" name="awesomeness1" min="0" max="10" value="10">
</p>
<div class="range">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="0">
<input type="range" name="awesomeness2" min="0" max="10" value="0">
<i class="icon ion-volume-high"></i>
</div>
<div class="list card">
<div class="item range">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="1">
<input type="range" name="awesomeness3" min="0" max="10" value="1">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-light">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="2">
<input type="range" name="awesomeness4" min="0" max="10" value="2">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-stable">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="3">
<input type="range" name="awesomeness5" min="0" max="10" value="3">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-positive">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="4">
<input type="range" name="awesomeness6" min="0" max="10" value="4">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-calm">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="5">
<input type="range" name="awesomeness7" min="0" max="10" value="5">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-balanced">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="6">
<input type="range" name="awesomeness8" min="0" max="10" value="6">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-assertive">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="7">
<input type="range" name="awesomeness9" min="0" max="10" value="7">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-energized">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="8">
<input type="range" name="awesomeness10" min="0" max="10" value="8">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-royal">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="9">
<input type="range" name="awesomeness11" min="0" max="10" value="9">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-dark">
<i class="icon ion-volume-low"></i>
<input type="range" name="awesomeness" min="0" max="10" value="10">
<input type="range" name="awesomeness12" min="0" max="10" value="10">
<i class="icon ion-volume-high"></i>
</div>
<div class="item range range-dark">
<label class="range-label">15</label>
<input type="range" name="awesomeness13" min="15" max="240" value="50">
</div>
<div class="item range range-dark">
<input type="range" name="awesomeness14" min="15" max="240" value="50">
<label class="range-label">240</label>
</div>
<div class="item range range-dark">
<label class="range-label">15</label>
<input type="range" name="awesomeness15" min="15" max="240" value="50">
<label class="range-label">240</label>
</div>
<div class="item range range-dark">
<label class="range-label">Blah blah blah</label>
<input type="range" name="awesomeness16" min="15" max="240" value="50">
<label class="range-label">asdf asdf asdf asdf </label>
</div>
</div>
<div class="padding">