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

demo(collectionRepeat/contacts): use icons instead of kittens

Browse Source
This commit is contained in:
Andrew Joslin
2014-06-03 09:13:32 -06:00
parent 7980ea877d
commit 264e092bf8
2 changed files with 7 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
demos/directive/collectionRepeat/contacts/contacts.css
View File

@@ -9,12 +9,14 @@ component: collectionRepeat
top: 5px;
color: #bbb;
}
.list .item.contact-item img {
.contact-item i.icon {
display: inline-block;
height: 60px;
width: 60px;
width: 40px;
float: left;
margin-top: 20px;
margin-right: 10px;
margin-right: 15px;
font-size: 30px;
text-align: center;
}
.list .item.contact-item {
left: 0;

2
demos/directive/collectionRepeat/contacts/contacts.html
View File

@@ -28,7 +28,7 @@ component: collectionRepeat
collection-item-width="100 + '%'"
ng-style="{'line-height': getItemHeight(item) + 'px'}"
ng-class="{'item-divider': item.isLetter}">
<img ng-if="!item.isLetter" ng-src="http://placekitten.com/60/{{55 + ($index % 10)}}">
<i ng-if="!item.isLetter" class="icon" ng-class="['ion-ios7-person','ion-person','ion-android-contact','ion-android-social-user','ion-person-stalker'][$index % 5]"></i>
{{item.letter || (item.first_name+' '+item.last_name)}}
</a>
</div>