<p class="lead" style="min-width: 300px;">
	<i class="fa fa-bell-o-alt"></i> Notifications
	<div class="pull-right">
		<a href="#" ng-click="clearAllNotifications()" class="btn btn-mini btn-danger" style="margin-right: 5px;" ng-if="unread > 0"><i class="fa fa-check"></i> Clear</a>
		<a href="{!! URL::to('notifications') !!}" class="btn btn-mini"><i class="fa fa-external-link"></i> All Notifications</a>
	</div>
</p>

<div class="chat-messages">
	<table class="table table-hover" ng-if="notifications.length > 0">
		<tbody>
			<tr ng-repeat="notification in notifications" ng-click="redirect(notification)">
				<td>
					{[{ notification.message }]}
				</td>
				<td>
					<div class="text-right">
						<small class="muted" tooltip="{[{ notification.created_at }]}">{[{ notification.created_at | fromNow }]}</small>
					</div>
				</td>
			</tr>
		</tbody>
	</table>

	<p ng-hide="notifications.length > 0"><i class="fa fa-info-circle"></i> You have no new notifications. <a href="{!! URL::to('notifications') !!}">View old notifications</a></p>
</div>