ion-item-content

This commit is contained in:
Adam Bradley
2015-08-24 16:37:39 -05:00
parent 5d7caada93
commit 2ac11fb716
22 changed files with 340 additions and 520 deletions

View File

@ -2,103 +2,70 @@
<ion-list>
<a class="item" href="#">
<div class="item-content">
a.item
</div>
<icon forward></icon>
<a ion-item href="#">
a.item
<icon forward item-right></icon>
</a>
<a class="item activated" href="#">
<div class="item-content">
a.item.activated
</div>
<icon forward></icon>
<a ion-item class="activated" href="#">
a.item.activated
<icon forward item-right></icon>
</a>
<button class="item">
<div class="item-content">
button.item
</div>
<icon forward></icon>
<button ion-item>
button.item
<icon forward item-right></icon>
</button>
<button class="item activated">
<div class="item-content">
button.item.activated
</div>
<icon forward></icon>
<button ion-item class="activated">
button.item.activated
<icon forward item-right></icon>
</button>
<div class="item">
<button>Edit</button>
<div class="item-content">
div.item left button
</div>
</div>
<ion-item>
<button item-left>Edit</button>
div.item left button
</ion-item>
<div class="item">
<div class="item-content">
div.item right button[outline][secondary]
</div>
<button secondary outline>Open</button>
</div>
<ion-item>
div.item right button[outline][secondary]
<button secondary outline item-right>Open</button>
</ion-item>
<div class="item">
<div class="item-content">
div.item icon only button
</div>
<button>
<ion-item>
div.item icon only button
<button item-right>
<icon name="ion-help-circled"></icon>
</button>
</div>
</ion-item>
<div class="item">
<div class="item-content">
div.item right icon/text button
</div>
<button>
<ion-item>
div.item right icon/text button
<button item-right>
<icon name="ion-refresh"></icon>
Refresh
</button>
</div>
</ion-item>
<div class="item">
<button clear>
<ion-item>
<button clear item-left>
<icon name="ion-wrench"></icon>
Fix
</button>
<div class="item-content">
div.item left clear button
</div>
</div>
div.item left clear button
</ion-item>
<div class="item">
<div class="item-content">
div.item right clear button
</div>
<button secondary clear>
<ion-item>
div.item right clear button
<button secondary clear item-right>
Edit
</button>
</div>
</ion-item>
<div class="item">
<div class="item-content item-text-wrap">
This is multiline text that has a
long description of about how the text is really long.
</div>
<button outline>View</button>
</div>
<ion-item class="item-text-wrap">
This is multiline text that has a
long description of about how the text is really long.
<button outline item-right>View</button>
</ion-item>
</ion-list>
<style>
body {
//background-image: url(/ionic2-iOS-component-design.png);
background-repeat: no-repeat;
background-size: 3906px 634px;
background-position: -384px -53px;
}
</style>