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

renamed .ion to .icon

Browse Source
This commit is contained in:
Adam Bradley
2013-11-05 20:32:17 -06:00
parent ecb3e6c469
commit 7955c49ccf
25 changed files with 1067 additions and 2817 deletions
Download Patch File Download Diff File Expand all files Collapse all files

122
test/buttons.html
View File

@@ -30,119 +30,119 @@
<h3>a.button default</h3>
<p>
<a class="button button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary"><i class="ion ion-home"></i></a>
<a class="button button-primary"><i class="ion ion-home"></i> .button-primary</a>
<a class="button button-info"><i class="ion ion-home"></i></a>
<a class="button button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary"><i class="icon ion-home"></i></a>
<a class="button button-primary"><i class="icon ion-home"></i> .button-primary</a>
<a class="button button-info"><i class="icon ion-home"></i></a>
<a class="button button-success">.button-success</a>
<a class="button button-warning"><i class="ion ion-home"></i> .button-warning</a>
<a class="button button-warning"><i class="icon ion-home"></i> .button-warning</a>
<a class="button button-danger">.button-danger</a>
<a class="button button-dark"><i class="ion ion-home"></i> .button-dark</a>
<a class="button button-dark"><i class="icon ion-home"></i> .button-dark</a>
</p>
<hr>
<h3>button.button default</h3>
<p>
<button class="button button-default"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-default"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-secondary">.button-secondary</button>
<button class="button button-primary"><i class="ion ion-home"></i> .button-primary</button>
<button class="button button-primary"><i class="icon ion-home"></i> .button-primary</button>
<button class="button button-info">.button-info</button>
<button class="button button-success"><i class="ion ion-home"></i></button>
<button class="button button-success"><i class="icon ion-home"></i></button>
<button class="button button-warning">.button-warning</button>
<button class="button button-danger"><i class="ion ion-home"></i> .button-danger</button>
<button class="button button-dark"><i class="ion ion-home"></i></button>
<button class="button button-danger"><i class="icon ion-home"></i> .button-danger</button>
<button class="button button-dark"><i class="icon ion-home"></i></button>
</p>
<hr>
<h3>a.button.button-large default</h3>
<p>
<a class="button button-large button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-large button-secondary"><i class="ion ion-home"></i></a>
<a class="button button-large button-primary"><i class="ion ion-home"></i> .button-primary</a>
<a class="button button-large button-info"><i class="ion ion-home"></i></a>
<a class="button button-large button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-large button-secondary"><i class="icon ion-home"></i></a>
<a class="button button-large button-primary"><i class="icon ion-home"></i> .button-primary</a>
<a class="button button-large button-info"><i class="icon ion-home"></i></a>
<a class="button button-large button-success">.button-success</a>
<a class="button button-large button-warning"><i class="ion ion-home"></i> .button-warning</a>
<a class="button button-large button-warning"><i class="icon ion-home"></i> .button-warning</a>
<a class="button button-large button-danger">.button-danger</a>
<a class="button button-large button-dark"><i class="ion ion-home"></i> .button-dark</a>
<a class="button button-large button-dark"><i class="icon ion-home"></i> .button-dark</a>
</p>
<hr>
<h3>button.button. button-large default</h3>
<p>
<button class="button button-large button-default"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-large button-default"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-large button-secondary">.button-secondary</button>
<button class="button button-large button-primary"><i class="ion ion-home"></i> .button-primary</button>
<button class="button button-large button-primary"><i class="icon ion-home"></i> .button-primary</button>
<button class="button button-large button-info">.button-info</button>
<button class="button button-large button-success"><i class="ion ion-home"></i></button>
<button class="button button-large button-success"><i class="icon ion-home"></i></button>
<button class="button button-large button-warning">.button-warning</button>
<button class="button button-large button-danger"><i class="ion ion-home"></i> .button-danger</button>
<button class="button button-large button-dark"><i class="ion ion-home"></i></button>
<button class="button button-large button-danger"><i class="icon ion-home"></i> .button-danger</button>
<button class="button button-large button-dark"><i class="icon ion-home"></i></button>
</p>
<hr>
<h3>a.button.button-small default</h3>
<p>
<a class="button button-small button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-small button-secondary"><i class="ion ion-home"></i></a>
<a class="button button-small button-primary"><i class="ion ion-home"></i> .button-primary</a>
<a class="button button-small button-info"><i class="ion ion-home"></i></a>
<a class="button button-small button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-small button-secondary"><i class="icon ion-home"></i></a>
<a class="button button-small button-primary"><i class="icon ion-home"></i> .button-primary</a>
<a class="button button-small button-info"><i class="icon ion-home"></i></a>
<a class="button button-small button-success">.button-success</a>
<a class="button button-small button-warning"><i class="ion ion-home"></i> .button-warning</a>
<a class="button button-small button-warning"><i class="icon ion-home"></i> .button-warning</a>
<a class="button button-small button-danger">.button-danger</a>
<a class="button button-small button-dark"><i class="ion ion-home"></i> .button-dark</a>
<a class="button button-small button-dark"><i class="icon ion-home"></i> .button-dark</a>
</p>
<hr>
<h3>button.button.button-small</h3>
<p>
<button class="button button-small button-default"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-small button-default"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-small button-secondary">.button-secondary</button>
<button class="button button-small button-primary"><i class="ion ion-home"></i> .button-primary</button>
<button class="button button-small button-primary"><i class="icon ion-home"></i> .button-primary</button>
<button class="button button-small button-info">.button-info</button>
<button class="button button-small button-success"><i class="ion ion-home"></i></button>
<button class="button button-small button-success"><i class="icon ion-home"></i></button>
<button class="button button-small button-warning">.button-warning</button>
<button class="button button-small button-danger"><i class="ion ion-home"></i> .button-danger</button>
<button class="button button-small button-dark"><i class="ion ion-home"></i></button>
<button class="button button-small button-danger"><i class="icon ion-home"></i> .button-danger</button>
<button class="button button-small button-dark"><i class="icon ion-home"></i></button>
</p>
<hr>
<h3>a.button.button-clear (Mixed in with others)</h3>
<p>
<a class="button button-clear button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary"><i class="ion ion-home"></i></a>
<a class="button button-clear button-primary"><i class="ion ion-home"></i> .button-primary</a>
<a class="button button-clear button-info"><i class="ion ion-home"></i></a>
<a class="button button-clear button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary"><i class="icon ion-home"></i></a>
<a class="button button-clear button-primary"><i class="icon ion-home"></i> .button-primary</a>
<a class="button button-clear button-info"><i class="icon ion-home"></i></a>
<a class="button button-success">.button-success</a>
<a class="button button-warning"><i class="ion ion-home"></i> .button-warning</a>
<a class="button button-warning"><i class="icon ion-home"></i> .button-warning</a>
<a class="button button-clear button-danger">.button-danger</a>
<a class="button button-clear button-dark"><i class="ion ion-home"></i> .button-dark</a>
<a class="button button-clear button-dark"><i class="icon ion-home"></i> .button-dark</a>
</p>
<hr>
<h3>button.button.button-clear default</h3>
<p>
<button class="button button-default"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-default"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-clear button-secondary">.button-secondary</button>
<button class="button button-primary"><i class="ion ion-home"></i> .button-primary</button>
<button class="button button-primary"><i class="icon ion-home"></i> .button-primary</button>
<button class="button button-clear button-info">.button-info</button>
<button class="button button-clear button-success"><i class="ion ion-home"></i></button>
<button class="button button-clear button-success"><i class="icon ion-home"></i></button>
<button class="button button-clear button-warning">.button-warning</button>
<button class="button button-clear button-danger"><i class="ion ion-home"></i> .button-danger</button>
<button class="button button-dark"><i class="ion ion-home"></i></button>
<button class="button button-clear button-danger"><i class="icon ion-home"></i> .button-danger</button>
<button class="button button-dark"><i class="icon ion-home"></i></button>
</p>
<hr>
<h3>a.block (parent w/ padding)</h3>
<p>
<a class="button block button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button block button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button block button-secondary">.button-secondary</a>
<a class="button block button-primary">.button-primary</a>
<a class="button block button-info">.button-info</a>
@@ -156,7 +156,7 @@
<h3>button.block (parent w/ padding)</h3>
<p>
<button class="button block button-default"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button block button-default"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button block button-secondary">.button-secondary</button>
<button class="button block button-primary">.button-primary</button>
<button class="button block button-info">.button-info</button>
@@ -170,35 +170,35 @@
<h3>a.button-icon (Borderless, 32px)</h3>
<p>
<a class="button button-icon"><i class="ion ion-home"></i></a>
<a class="button button-icon"><i class="icon ion-home"></i></a>
</p>
<hr>
<h3>button.button-icon (Borderless, 32px)</h3>
<p>
<button class="button button-icon"><i class="ion ion-home"></i></button>
<button class="button button-icon"><i class="icon ion-home"></i></button>
</p>
<hr>
<h3>a.block.button-icon (Borderless, 32px)</h3>
<p>
<a class="button block button-icon"><i class="ion ion-home"></i></a>
<a class="button block button-icon"><i class="icon ion-home"></i></a>
</p>
<hr>
<h3>button.block.button-icon (Borderless, 32px)</h3>
<p>
<button class="button block button-icon"><i class="ion ion-home"></i></button>
<button class="button block button-icon"><i class="icon ion-home"></i></button>
</p>
<hr>
<h3>a.button-outline</h3>
<p>
<a class="button button-default button-outline"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-default button-outline"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary button-outline">.button-secondary</a>
<a class="button button-primary button-outline">.button-primary</a>
<a class="button button-info button-outline">.button-info</a>
@@ -212,7 +212,7 @@
<h3>button.button-outline</h3>
<p>
<button class="button button-default button-outline"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-default button-outline"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-secondary button-outline">.button-secondary</button>
<button class="button button-primary button-outline">.button-primary</button>
<button class="button button-info button-outline">.button-info</button>
@@ -226,7 +226,7 @@
<h3>a.block.button-outline (parent w/ padding)</h3>
<p>
<a class="button button-default button-outline block"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-default button-outline block"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary button-outline block">.button-secondary</a>
<a class="button button-primary button-outline block">.button-primary</a>
<a class="button button-info button-outline block">.button-info</a>
@@ -240,7 +240,7 @@
<h3>button.block.button-outline (parent w/ padding)</h3>
<p>
<button class="button button-default button-outline block"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-default button-outline block"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-secondary button-outline block">.button-secondary</button>
<button class="button button-primary button-outline block">.button-primary</button>
<button class="button button-info button-outline block">.button-info</button>
@@ -254,7 +254,7 @@
<h3>a.button-clear</h3>
<p>
<a class="button button-default button-clear"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-default button-clear"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary button-clear">.button-secondary</a>
<a class="button button-primary button-clear">.button-primary</a>
<a class="button button-info button-clear">.button-info</a>
@@ -268,7 +268,7 @@
<h3>button.button-clear</h3>
<p>
<button class="button button-default button-clear"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-default button-clear"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-secondary button-clear">.button-secondary</button>
<button class="button button-primary button-clear">.button-primary</button>
<button class="button button-info button-clear">.button-info</button>
@@ -282,7 +282,7 @@
<h3>a.block.button-clear (parent w/ padding)</h3>
<p>
<a class="button button-default button-clear block"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-default button-clear block"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary button-clear block">.button-secondary</a>
<a class="button button-primary button-clear block">.button-primary</a>
<a class="button button-info button-clear block">.button-info</a>
@@ -296,7 +296,7 @@
<h3>button.block.button-clear (parent w/ padding)</h3>
<p>
<button class="button button-default button-clear block"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-default button-clear block"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-secondary button-clear block">.button-secondary</button>
<button class="button button-primary button-clear block">.button-primary</button>
<button class="button button-info button-clear block">.button-info</button>
@@ -312,7 +312,7 @@
<h3>a.block (parent w/out padding)</h3>
<p>
<a class="button block button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button block button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button block button-secondary">.button-secondary</a>
<a class="button block button-primary">.button-primary</a>
<a class="button block button-info">.button-info</a>
@@ -326,7 +326,7 @@
<h3>a.block (.button-full on the parent)</h3>
<p class="button-full">
<a class="button button-default"><i class="ion ion-home"></i> MB.button-default|!PL</a>
<a class="button button-default"><i class="icon ion-home"></i> MB.button-default|!PL</a>
<a class="button button-secondary">.button-secondary</a>
<a class="button button-primary">.button-primary</a>
<a class="button button-info">.button-info</a>
@@ -340,7 +340,7 @@
<h3>button.block.button-full on each button and nothing on the parent</h3>
<p>
<button class="button button-full button-default"><i class="ion ion-home"></i> MB.button-default|!PL</button>
<button class="button button-full button-default"><i class="icon ion-home"></i> MB.button-default|!PL</button>
<button class="button button-full button-secondary">.button-secondary</button>
<button class="button button-full button-primary">.button-primary</button>
<button class="button button-full button-info">.button-info</button>

16
test/cards.html
View File

@@ -47,22 +47,22 @@
<div class="list card">
<a href="#" class="item item-icon-left">
<i class="ion ion-home"></i>
<i class="icon ion-home"></i>
Enter home address
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-ios7-telephone"></i>
<i class="icon ion-ios7-telephone"></i>
Enter phone number
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-wifi"></i>
<i class="icon ion-wifi"></i>
Enter wireless password
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-card"></i>
<i class="icon ion-card"></i>
Enter card information
</a>
@@ -81,7 +81,7 @@
</div>
<a href="#" class="item item-icon-left">
<i class="ion ion-music-note"></i>
<i class="icon ion-music-note"></i>
Start listening
</a>
@@ -122,15 +122,15 @@
<div class="item tabs tabs-secondary tabs-icon-left">
<a class="tab-item" href="#">
<i class="ion ion-thumbsup"></i>
<i class="icon ion-thumbsup"></i>
Like
</a>
<a class="tab-item" href="#">
<i class="ion ion-chatbox"></i>
<i class="icon ion-chatbox"></i>
Comment
</a>
<a class="tab-item" href="#">
<i class="ion ion-share"></i>
<i class="icon ion-share"></i>
Share
</a>
</div>

2
test/controllers/sideMenu.html
View File

@@ -13,7 +13,7 @@
<section id="content" class="pane menu-animated">
<header class="bar bar-header bar-dark">
<a href="#" class="button"><i class="ion ion-reorder"></i></a>
<a href="#" class="button"><i class="icon ion-reorder"></i></a>
<h1 class="title">Tab Bars</h1>
</header>

16
test/headers.html
View File

@@ -21,12 +21,12 @@
<header class="bar bar-header bar-dark">
<a class="button">Back</a>
<h1 class="title">Really really really really really really really really long title!</h1>
<a class="button"><i class="ion ion-home"></i> Home</a>
<a class="button"><i class="icon ion-home"></i> Home</a>
</header>
<div class="bar bar-header-secondary bar-success">
<a class="button">
<i class="ion ion-home"></i> Home
<i class="icon ion-home"></i> Home
</a>
<div class="button-bar">
<a class="button">Success</a>
@@ -40,7 +40,7 @@
<header class="bar bar-header bar-default">
<a class="button button-default">
<i class="ion ion-home"></i> Home
<i class="icon ion-home"></i> Home
</a>
<div class="button-bar">
<a class="button">Success</a>
@@ -48,13 +48,13 @@
<a class="button">Danger</a>
</div>
<a class="button">
<i class="ion ion-star"></i> Favorites
<i class="icon ion-star"></i> Favorites
</a>
</header>
<div class="bar bar-header bar-default">
<a class="button button-icon">
<i class="ion ion-home"></i>
<i class="icon ion-home"></i>
</a>
<div class="button-bar">
<a href="#" class="button button-clear">Edit</a>
@@ -62,13 +62,13 @@
<a href="#" class="button button-clear">Delete</a>
</div>
<a class="button button-icon">
<i class="ion ion-home"></i>
<i class="icon ion-home"></i>
</a>
</div>
<header class="bar bar-header bar-default">
<a class="button button-default">
<i class="ion ion-home"></i>
<i class="icon ion-home"></i>
</a>
<div class="button-bar">
<a class="button">Success</a>
@@ -76,7 +76,7 @@
<a class="button">Danger</a>
</div>
<a class="button">
<i class="ion ion-star"></i>
<i class="icon ion-star"></i>
</a>
</header>

67
test/index.html
View File

@@ -8,48 +8,35 @@
</head>
<body>
<section>
<header class="bar bar-header bar-dark">
<h1 class="title">Ionic Tests</h1>
</header>
<header class="bar bar-header bar-dark">
<h1 class="title">Ionic Tests</h1>
</header>
<div class="content-wrapper">
<main class="content padding has-header">
<p><a class="button button-block button-default" href="alerts.html"><i class="ion ion-star"></i> Alerts</a></p>
<p><a class="button button-block button-default" href="buttons.html"><i class="ion ion-star"></i> Buttons</a></p>
<p><a class="button button-block button-default" href="button-bar.html"><i class="ion ion-star"></i> Button Bar</a></p>
<p><a class="button button-block button-default" href="cards.html"><i class="ion ion-star"></i> Cards</a></p>
<p><a class="button button-block button-default" href="footers.html"><i class="ion ion-star"></i> Footers</a></p>
<p><a class="button button-block button-default" href="headers.html"><i class="ion ion-star"></i> Headers</a></p>
<p><a class="button button-block button-default" href="input-text.html"><i class="ion ion-star"></i> Input: Text (single-line)</a></p>
<p><a class="button button-block button-default" href="input-textarea.html"><i class="ion ion-star"></i> Input: Text (multi-line)</a></p>
<p><a class="button button-block button-default" href="input-radio.html"><i class="ion ion-star"></i> Input: Radio Buttons</a></p>
<p><a class="button button-block button-default" href="input-range.html"><i class="ion ion-star"></i> Input: Range</a></p>
<p><a class="button button-block button-default" href="input-select.html"><i class="ion ion-star"></i> Input: Select</a></p>
<p><a class="button button-block button-default" href="input-checkbox.html"><i class="ion ion-star"></i> Input: Checkbox</a></p>
<p><a class="button button-block button-default" href="input-toggle.html"><i class="ion ion-star"></i> Input: Toggle</a></p>
<p><a class="button button-block button-default" href="lists.html"><i class="ion ion-star"></i> Lists</a></p>
<p><a class="button button-block button-default" href="modals.html"><i class="ion ion-star-empty"></i> Modals</a></p>
<p><a class="button button-block button-default" href="popovers.html"><i class="ion ion-star-empty"></i> Popovers</a></p>
<p><a class="button button-block button-default" href="pull-to-refresh.html"><i class="ion ion-star-empty"></i> Pull To Refresh</a></p>
<p><a class="button button-block button-default" href="side-menus.html"><i class="ion ion-star-empty"></i> Side Menus</a></p>
<p><a class="button button-block button-default" href="swipe.html"><i class="ion ion-star-empty"></i> Swipe</a></p>
<p><a class="button button-block button-default" href="tab-bars.html"><i class="ion ion-star-half-empty"></i> Tab Bars</a></p>
<p><a class="button button-block button-default" href="type.html"><i class="ion ion-star"></i> Type</a></p>
</main>
<div class="content padding has-header">
<p><a class="button button-block button-default" href="alerts.html"><i class="icon ion-star"></i> Alerts</a></p>
<p><a class="button button-block button-default" href="buttons.html"><i class="icon ion-star"></i> Buttons</a></p>
<p><a class="button button-block button-default" href="button-bar.html"><i class="icon ion-star"></i> Button Bar</a></p>
<p><a class="button button-block button-default" href="cards.html"><i class="icon ion-star"></i> Cards</a></p>
<p><a class="button button-block button-default" href="footers.html"><i class="icon ion-star"></i> Footers</a></p>
<p><a class="button button-block button-default" href="headers.html"><i class="icon ion-star"></i> Headers</a></p>
<p><a class="button button-block button-default" href="input-text.html"><i class="icon ion-star"></i> Input: Text (single-line)</a></p>
<p><a class="button button-block button-default" href="input-textarea.html"><i class="icon ion-star"></i> Input: Text (multi-line)</a></p>
<p><a class="button button-block button-default" href="input-radio.html"><i class="icon ion-star"></i> Input: Radio Buttons</a></p>
<p><a class="button button-block button-default" href="input-range.html"><i class="icon ion-star"></i> Input: Range</a></p>
<p><a class="button button-block button-default" href="input-select.html"><i class="icon ion-star"></i> Input: Select</a></p>
<p><a class="button button-block button-default" href="input-checkbox.html"><i class="icon ion-star"></i> Input: Checkbox</a></p>
<p><a class="button button-block button-default" href="input-toggle.html"><i class="icon ion-star"></i> Input: Toggle</a></p>
<p><a class="button button-block button-default" href="lists.html"><i class="icon ion-star"></i> Lists</a></p>
<p><a class="button button-block button-default" href="modals.html"><i class="icon ion-star-empty"></i> Modals</a></p>
<p><a class="button button-block button-default" href="popovers.html"><i class="icon ion-star-empty"></i> Popovers</a></p>
<p><a class="button button-block button-default" href="pull-to-refresh.html"><i class="icon ion-star-empty"></i> Pull To Refresh</a></p>
<p><a class="button button-block button-default" href="side-menus.html"><i class="icon ion-star-empty"></i> Side Menus</a></p>
<p><a class="button button-block button-default" href="swipe.html"><i class="icon ion-star-empty"></i> Swipe</a></p>
<p><a class="button button-block button-default" href="tab-bars.html"><i class="icon ion-star-half-empty"></i> Tab Bars</a></p>
<p><a class="button button-block button-default" href="type.html"><i class="icon ion-star"></i> Type</a></p>
</div>
</section>
<script>
// cache buster only for testing to make sure the page is always refreshed
// for(var x=0; x<document.links.length; x++) {
// document.links[x].href += "?r=" + Math.random();
// }
</script>
</body>
</html>
</html>

14
test/input-text.html
View File

@@ -107,12 +107,12 @@
<h3>Label left of input, No Parent Content Padding</h3>
<div class="list">
<label class="item item-input">
<i class="ion ion-person"></i>
<i class="icon ion-person"></i>
<span class="input-label">Username</span>
<input type="text" placeholder="@drifty">
</label>
<label class="item item-input">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
<span class="input-label">Email</span>
<input type="email" placeholder="your@email.com">
</label>
@@ -212,7 +212,7 @@
<h3>Default Text Input, No Parent Content Padding</h3>
<div class="list">
<label class="item item-input">
<i class="ion ion-search placeholder-icon"></i>
<i class="icon ion-search placeholder-icon"></i>
<input type="search" placeholder="Search">
</label>
</div>
@@ -220,7 +220,7 @@
<h3>Default Text Input, list-inset, No Parent Content Padding</h3>
<div class="list list-inset">
<label class="item item-input">
<i class="ion ion-star placeholder-icon"></i>
<i class="icon ion-star placeholder-icon"></i>
<input type="text" placeholder="Favorites">
</label>
</div>
@@ -229,7 +229,7 @@
<h3>Stacked Label On Top Of Text Input, No Parent Content Padding</h3>
<div class="list">
<label class="item item-input item-stacked-label">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
<span class="input-label">Email</span>
<input type="text" placeholder="your@email.com">
</label>
@@ -240,7 +240,7 @@
<h3>Stacked Label On Top Of Text Input, With Parent Content Padding</h3>
<div class="list">
<label class="item item-input item-stacked-label">
<i class="ion ion-cloud"></i>
<i class="icon ion-cloud"></i>
<span class="input-label">SaaS</span>
<input type="text" placeholder="Codiqa">
</label>
@@ -249,7 +249,7 @@
<h3>Stacked Label On Top Of Text Input, list-inset, With Parent Content Padding</h3>
<div class="list list-inset">
<label class="item item-input item-stacked-label">
<i class="ion ion-headphone"></i>
<i class="icon ion-headphone"></i>
<span class="input-label">Favorite Music</span>
<input type="text" placeholder="Bee Gees">
</label>

66
test/lists.html
View File

@@ -30,12 +30,12 @@
</div>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-chatbubble-working"></i>
<i class="icon ion-chatbubble-working"></i>
Call Ma
</a>
@@ -48,28 +48,28 @@
</div>
<a href="#" class="item item-icon-left">
<i class="ion ion-email ion-secondary"></i>
<i class="icon ion-email ion-secondary"></i>
Check mail
<span class="badge badge-info">5</span>
</a>
<a href="#" class="item item-icon-left item-button-right">
<i class="ion ion-chatbubble-working ion-primary"></i>
<i class="icon ion-chatbubble-working ion-primary"></i>
Call Ma
<button class="button button-success">
<i class="ion ion-ios7-telephone"></i>
<i class="icon ion-ios7-telephone"></i>
</button>
</a>
<a href="#" class="item item-button-left">
<button class="button button-success">
<i class="ion ion-ios7-telephone"></i>
<i class="icon ion-ios7-telephone"></i>
</button>
Me Button
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-mic-a ion-info"></i>
<i class="icon ion-mic-a ion-info"></i>
Record album
<span class="item-note">
Grammy
@@ -77,7 +77,7 @@
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-flask ion-success"></i>
<i class="icon ion-flask ion-success"></i>
Breaking Bad
<span class="item-note">
Blue, yellow, pink
@@ -89,7 +89,7 @@
</div>
<a href="#" class="item item-icon-left">
<i class="ion ion-game-controller-b ion-warning"></i>
<i class="icon ion-game-controller-b ion-warning"></i>
Games
<span class="item-note">
Super Mario
@@ -97,7 +97,7 @@
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-music-note ion-danger"></i>
<i class="icon ion-music-note ion-danger"></i>
Music
<span class="item-note">
JT
@@ -105,7 +105,7 @@
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-bag ion-dark"></i>
<i class="icon ion-bag ion-dark"></i>
Shopping
<span class="item-note">
Bag
@@ -113,7 +113,7 @@
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-person-stalker ion-warning fill-icon"></i>
<i class="icon ion-person-stalker ion-warning fill-icon"></i>
Friends
<span class="badge badge-danger">0</span>
</a>
@@ -139,7 +139,7 @@
<a href="#" class="item item-icon-right">
<div class="item-content slide-right">
Processing Icon
<i class="ion ion-loading"></i>
<i class="icon ion-loading"></i>
</div>
</a>
@@ -252,19 +252,19 @@
</div>
<a href="#" class="item item-icon-left">
<i class="ion ion-heart brand-danger"></i>
<i class="icon ion-heart brand-danger"></i>
Madison, WI
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-image brand-warning"></i>
<i class="icon ion-image brand-warning"></i>
Driving Directions
</a>
<a href="#" class="item item-icon-left item-icon-right">
<i class="ion ion-ios7-cog gray"></i>
<i class="icon ion-ios7-cog gray"></i>
Settings
<i class="ion ion-ios7-information-outline"></i>
<i class="icon ion-ios7-information-outline"></i>
</a>
</div>
@@ -273,17 +273,17 @@
<a href="#" class="item item-icon-left item-icon-right item-slider">
<div class="item-content">
<i class="ion ion-heart brand-danger fill-icon"></i>
<i class="icon ion-heart brand-danger fill-icon"></i>
Madison, WI
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</div>
</a>
<a href="#" class="item item-icon-left item-icon-right item-slider">
<div class="item-content slide-left">
<i class="ion ion-image brand-warning fill-icon"></i>
<i class="icon ion-image brand-warning fill-icon"></i>
Driving Directions
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</div>
<div class="item-options">
<button class="button">Button</button>
@@ -292,9 +292,9 @@
<a href="#" class="item item-icon-left item-icon-right item-slider">
<div class="item-content slide-right">
<i class="ion ion-ios7-cog gray fill-icon"></i>
<i class="icon ion-ios7-cog gray fill-icon"></i>
Settings
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</div>
</a>
@@ -308,14 +308,14 @@
<a href="#" class="item item-icon-left">
<div class="item-content">
<i class="ion ion-heart brand-danger fill-icon"></i>
<i class="icon ion-heart brand-danger fill-icon"></i>
Icon is filled!!
</div>
</a>
<a href="#" class="item item-icon-left">
<div class="item-content">
<i class="ion ion-image brand-warning fill-icon"></i>
<i class="icon ion-image brand-warning fill-icon"></i>
.fill-icon
</div>
</a>
@@ -325,28 +325,28 @@
</div>
<a href="#" class="item item-icon-left item-icon-right">
<i class="ion ion-ios7-cog gray fill-icon"></i>
<i class="icon ion-ios7-cog gray fill-icon"></i>
Default has no wrap! This is a list item with really really really really really
really really really really long long long long long long
text text text texxxxxttt text testy text!!!
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</a>
<a href="#" class="item item-icon-left item-icon-right item-text-wrap">
<i class="ion ion-ios7-cog gray fill-icon"></i>
<i class="icon ion-ios7-cog gray fill-icon"></i>
Assigned "item-text-wrap". This is a list item with really really really really really
really really really really long long long long long long
text text text texxxxxttt text testy text!!!
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</a>
<a href="#" class="item item-icon-left item-icon-right item-slider">
<div class="item-content slide-left slide-right">
<i class="ion ion-ios7-cog gray fill-icon"></i>
<i class="icon ion-ios7-cog gray fill-icon"></i>
Default no wrap and has item-content! This is a list item with really really really really really
really really really really long long long long long long
text text text texxxxxttt text testy text!!!
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</div>
<div class="item-options">
<button class="button">Button</button>
@@ -355,11 +355,11 @@
<a href="#" class="item item-icon-left item-icon-right item-text-wrap item-slider">
<div class="item-content slide-left slide-right">
<i class="ion ion-ios7-cog gray fill-icon"></i>
<i class="icon ion-ios7-cog gray fill-icon"></i>
Assigned "item-text-wrap" and has item-content. This is a list item with really really really really really
really really really really long long long long long long
text text text texxxxxttt text testy text!!!
<i class="ion ion-chevron-right"></i>
<i class="icon ion-chevron-right"></i>
</div>
<div class="item-options">
<button class="button">Button</button>

104
test/menu_controller.html
View File

@@ -14,13 +14,13 @@
<header class="bar bar-header bar-dark">
<div class="buttons">
<a id="left-button" class="button button-dark" href="#">
<i class="ion ion-reorder"></i>
<i class="icon ion-reorder"></i>
</a>
</div>
<h1 class="title">Chats</h1>
<div class="buttons">
<button id="right-button" class="button button-dark">
<i class="ion ion-cog"></i>
<i class="icon ion-cog"></i>
</button>
</div>
</header>
@@ -65,103 +65,103 @@
<li class="list-divider">Left Nav Things</li>
<a href="#" class="list-item">
Sasafras
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
</ul>
</section>
@@ -171,103 +171,103 @@
<li class="list-divider">Left Nav Things</li>
<a href="#" class="list-item">
Sasafras
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
</ul>
</section>

104
test/menus.html
View File

@@ -14,11 +14,11 @@
<header class="bar bar-header bar-dark">
<button class="button button-borderless button-transparent " data-panel-toggle="my-left-panel">
<i class="ion ion-reorder"></i>
<i class="icon ion-reorder"></i>
</button>
<h1 class="title">Panels</h1>
<button class="button button-borderless button-transparent " data-panel-toggle="my-right-panel" data-panel-direction="right">
<i class="ion ion-cog"></i>
<i class="icon ion-cog"></i>
</button>
</header>
@@ -39,103 +39,103 @@
<li class="list-divider">Left Nav Things</li>
<a href="#" class="list-item">
Sasafras
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
</ul>
</section>
@@ -145,103 +145,103 @@
<li class="list-divider">Right Nav Things</li>
<a href="#" class="list-item">
Sasafras
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Candy
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
<a href="#" class="list-item">
Cheese cords
<i class="ion ion-arrow-right"></i>
<i class="icon ion-arrow-right"></i>
</a>
</ul>
</section>

4
test/side-menus.html
View File

@@ -13,13 +13,13 @@
<header class="bar bar-header bar-dark">
<div class="buttons">
<a id="left-button" class="button button-dark" href="#">
<i class="ion ion-reorder"></i>
<i class="icon ion-reorder"></i>
</a>
</div>
<h1 class="title">Chats</h1>
<div class="buttons">
<button id="right-button" class="button button-dark">
<i class="ion ion-cog"></i>
<i class="icon ion-cog"></i>
</button>
</div>
</header>

6
test/slideBox.html
View File

@@ -38,9 +38,9 @@
</div>
</div>
<div class="slide-box-pager">
<span><i class="ion ion-record"></i></span>
<span><i class="ion ion-record"></i></span>
<span><i class="ion ion-record"></i></span>
<span><i class="icon ion-record"></i></span>
<span><i class="icon ion-record"></i></span>
<span><i class="icon ion-record"></i></span>
</div>
</div>
</div>

62
test/splitPane.html
View File

@@ -24,127 +24,127 @@
<h1>Left side</h1>
<ul class="list">
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
<a href="#" class="item item-icon-left">
<i class="ion ion-email"></i>
<i class="icon ion-email"></i>
Check mail
</a>
</ul>

10
test/tab-bars-icons-bottom.html
View File

@@ -31,23 +31,23 @@
<nav id="tab-bar" class="tabs tabs-icon-bottom tabs-default">
<a class="tab-item tab-item-danger" href="#">
Fun
<i class="ion ion-game-controller-a"></i>
<i class="icon ion-game-controller-a"></i>
</a>
<a class="tab-item tab-item-danger">
Security
<i class="ion ion-locked"></i>
<i class="icon ion-locked"></i>
</a>
<a class="tab-item tab-item-danger">
Simple
<i class="ion ion-heart"></i>
<i class="icon ion-heart"></i>
</a>
<a class="tab-item tab-item-danger">
Light
<i class="ion ion-leaf"></i>
<i class="icon ion-leaf"></i>
</a>
<a class="tab-item tab-item-danger">
Clean
<i class="ion ion-waterdrop"></i>
<i class="icon ion-waterdrop"></i>
</a>
</nav>

10
test/tab-bars-icons-left.html
View File

@@ -30,23 +30,23 @@
<nav id="tab-bar" class="tabs tabs-icon-left tabs-default">
<a class="tab-item tab-item-danger" href="#">
<i class="ion ion-game-controller-a"></i>
<i class="icon ion-game-controller-a"></i>
Fun
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-locked"></i>
<i class="icon ion-locked"></i>
Security
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-heart"></i>
<i class="icon ion-heart"></i>
Simple
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-leaf"></i>
<i class="icon ion-leaf"></i>
Light
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-waterdrop"></i>
<i class="icon ion-waterdrop"></i>
Clean
</a>
</nav>

10
test/tab-bars-icons-right.html
View File

@@ -31,23 +31,23 @@
<nav id="tab-bar" class="tabs tabs-icon-right tabs-default">
<a class="tab-item tab-item-danger" href="#">
Fun
<i class="ion ion-game-controller-a"></i>
<i class="icon ion-game-controller-a"></i>
</a>
<a class="tab-item tab-item-danger">
Security
<i class="ion ion-locked"></i>
<i class="icon ion-locked"></i>
</a>
<a class="tab-item tab-item-danger">
Simple
<i class="ion ion-heart"></i>
<i class="icon ion-heart"></i>
</a>
<a class="tab-item tab-item-danger">
Light
<i class="ion ion-leaf"></i>
<i class="icon ion-leaf"></i>
</a>
<a class="tab-item tab-item-danger">
Clean
<i class="ion ion-waterdrop"></i>
<i class="icon ion-waterdrop"></i>
</a>
</nav>

10
test/tab-bars-only-icons.html
View File

@@ -30,19 +30,19 @@
<nav id="tab-bar" class="tabs tabs-icon-only tabs-default">
<a class="tab-item tab-item-danger" href="#">
<i class="ion ion-game-controller-a"></i>
<i class="icon ion-game-controller-a"></i>
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-locked"></i>
<i class="icon ion-locked"></i>
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-heart"></i>
<i class="icon ion-heart"></i>
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-leaf"></i>
<i class="icon ion-leaf"></i>
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-waterdrop"></i>
<i class="icon ion-waterdrop"></i>
</a>
</nav>

10
test/tab-bars.html
View File

@@ -30,23 +30,23 @@
<nav id="tab-bar" class="tabs tabs-icon-top tabs-default">
<a class="tab-item tab-item-danger" href="#">
<i class="ion ion-game-controller-a"></i>
<i class="icon ion-game-controller-a"></i>
Fun
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-locked"></i>
<i class="icon ion-locked"></i>
Security
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-heart"></i>
<i class="icon ion-heart"></i>
Simple
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-leaf"></i>
<i class="icon ion-leaf"></i>
Light
</a>
<a class="tab-item tab-item-danger">
<i class="ion ion-waterdrop"></i>
<i class="icon ion-waterdrop"></i>
Clean
</a>
</nav>