<div class="panel panel-default">

<div class="panel-heading">

Notes

<span class="pull-right btn-group">

<a href="" class="btn btn-xs btn-success" ui-sref="^.add()">

<i class="fa fa-plus"></i>

</a>

</span>

</div>

<div class='list-group'>

<div ng-repeat="item in ctrl.notes" class="list-group-item">

<span class="pull-right btn-group">

<a href="" class="btn btn-xs btn-default" ui-sref="^.edit({id: item.id})">

<i class="fa fa-pencil"></i>

</a>

<a href="" class="btn btn-xs btn-danger" ui-sref="^.delete({id: item.id})">

<i class="fa fa-trash-o"></i>

</a>

</span>

<h4 class="list-group-item-heading">

<a href="" ui-sref="^.view({id: item.id})">{{item.title}}</a>

</h4>

<p class="list-group-item-text">{{item.body}}</p>

</div>

<div ng-show="!ctrl.notes.length" class="list-group-item">

<h4 class="list-group-item-heading" translate>

There are no notes

</h4>

<p class="list-group-item-text" translate>Click <a href="" ui-sref="^.add">here</a> to add a note!</p>

</div>

</div>

</div>