<div class="panel panel-warning">
  <div class="panel-heading">
    <strong><span class="glyphicon glyphicon-globe" aria-hidden="true"></span> {{frontendCtrl.frontend.frontendId}}</strong>
  </div>
  <div class="panel-body">
    <table class="panel-table__routes table table-striped table-hover">
      <tr>
        <td><em>Route</em></td>
        <td><em>Rule</em></td>
      </tr>
      <tr data-ng-repeat="(routeId, route) in frontendCtrl.frontend.routes">
        <td>{{routeId}}</td>
        <td><code>{{route.rule}}</code></td>
      </tr>
    </table>
  </div>
  <div data-bg-show="frontendCtrl.frontend.backend" class="panel-footer">
    <span data-ng-repeat="entryPoint in frontendCtrl.frontend.entryPoints">
      <span class="label label-primary">{{entryPoint}}</span><span data-ng-hide="$last">&nbsp;</span>
    </span>
    <span class="label label-warning" role="button" data-toggle="collapse" href="#{{frontendCtrl.frontend.backend}}" aria-expanded="false">Backend:{{frontendCtrl.frontend.backend}}</span>
    <span data-ng-show="frontendCtrl.frontend.passHostHeader" class="label label-warning">PassHostHeader</span>
    <span data-ng-repeat="whitelistSourceRange in frontendCtrl.frontend.whitelistSourceRange">
      <span class="label label-warning">Whitelist {{ whitelistSourceRange }}</span>
    </span>
    <span data-ng-show="frontendCtrl.frontend.priority" class="label label-warning">Priority:{{frontendCtrl.frontend.priority}}</span>
  </div>
</div>
