Ionic: Custom ion list items - css

Question

I am new to Ionic framework, I am trying to create an ion-list like in the picture, but I can't figure out how to use item-thumbnail-right and item-avatar in the one item with some stuff in the right corner and a pseudo footer like in the picture...
I tried this code:
<ion-list>
<a class="item item-thumbnail-right" ng-repeat="activeOffer in activeOffers"
ng-href="#/app/offers/{{activeOffer.offer.id}}">
<img ng-src="{{siteRoot}}/upload/assets/img/media-support/{{activeOffer.mediaSupport.fileName}}">
<div class="item item-avatar">
<img ng-src="{{siteRoot}}/upload/assets/img/localbusiness/{{activeOffer.localBusiness.logo}}">
<h2>{{activeOffer.localBusiness.label}}</h2>
<p>{{activeOffer.localBusiness.description}}</p>
</div>
<h2>{{activeOffer.offer.title}}</h2>
<p>{{activeOffer.offer.description}}</p>
</a>
</ion-list>
But, I'm getting something ugly

Answer 1

Try with following example:
<ion-item class="item-remove-animate item-avatar-right" ng-repeat="item in listingData.app" type="item-text-wrap" href="#/tab/restaurant_category/{{item.rest_id}}">
<img ng-src="{{item.logo}}">
<img src="" style="float:left;width: 15px;height: 15px;">
<h2>{{item.restaurant_name}}</h2>
<p ng-repeat="cuisne in item.available_cuisine.cuisine">{{cuisne.name}}</p>
<div class="row order-policy-time">
<div class="col col-50">
<p>delivers in 60 min</p>
</div>
<div class="col text-right">
<p>collection in 30 min</p>
</div>
</div>
<div class="welcome-custom-icon">
<span class="ti-angle-right"></span>
</div>
</ion-item>